-1

オンラインのチュートリアルに従っていますが、CSS を HTML コードにリンクできないようです。両方のファイルを同じフォルダーに配置しました。ファイルは tut.html および tut.css と呼ばれます

HTML:

<html>
<head>
<title>HTML5 Tutorial</title>
<link rel='stylesheet' href='tut.css'/>
</head>
<div id="wrapper">
<div id="header">
<div id="navigation">
<ul>
<li><a href="#">navigation1</a></li>
<li><a href="#">navigation2</a></li>
</ul>
</div>
</div>
<div id="sidebar">
<p>here is the sidebar</p>
</div>
<div id="content">
<p>here is the content</p>
</div>
<div id="footer">
<p>Here is the footer</p>
</div>
</div>
</html>

CSS:

    #wrapper {
  margin-right: auto;
  margin-left: auto;
  width: 96%;
}
#header {
  margin-right: 10px;
  margin-left: 10px;
  width: 940px;
}
#navigation {
  padding-bottom: 25px;
  margin-top: 26px;
  margin-left: -10px;
  padding-right: 10px;
  padding-left: 10px;
  width: 940px;
}
#navigation ul li {
  display: inline-block;
}
#content {
  margin-top: 58px;
  margin-right: 10px;
  float: right;
  width: 698px;
}
#sidebar {
  border-right-color: #e8e8e8;
  border-right-style: solid;
  border-right-width: 2px;
  margin-top: 58px;
  padding-right: 10px;
  margin-right: 10px;
  margin-left: 10px;
  float: left;
  width: 220px;
}
#footer {
  float: left;
  margin-top: 20px;
  margin-right: 10px;
  margin-left: 10px;
  clear: both;
  width: 940px;
}
4

2 に答える 2

1

HTML が無効です。<body>おそらく問題の原因である HTML にタグがありません。そうでない場合は、ページの上部に doctype も提供する必要があります。あなたのhtmlをこれにします：

<!doctype html>    
<html>
<head>
<title>HTML5 Tutorial</title>
<link rel='stylesheet' href='tut.css'/>
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="navigation">
<ul>
<li><a href="#">navigation1</a></li>
<li><a href="#">navigation2</a></li>
</ul>
</div>
</div>
<div id="sidebar">
<p>here is the sidebar</p>
</div>
<div id="content">
<p>here is the content</p>
</div>
<div id="footer">
<p>Here is the footer</p>
</div>
</div>
</body>
</html>
于 2013-05-22T13:14:35.300 に答える
1

まさにこのファイルがある場合：

tut.css

そして、それは と同じフォルダーにtut.htmlあります。すべてのブラウザーで問題なく動作したため、HTML/CSS が正しく動作する必要があります。このような名前で CSS ファイルを保存した可能性があります: tut.css.txt.

Windows を使用している場合は、次の手順に従ってファイル名を確認してください。

  1. マイコンピュータを開く
  2. Viewメニューから、選択Folder and Search Options
  3. 開いたウィンドウのViewタブで、このオプションの選択を解除します:既知のファイル タイプの拡張子を非表示にする
  4. 適用してOK

ここに画像の説明を入力

ここで、css ファイルの完全な名前を確認する必要があります。

于 2013-05-22T13:33:00.853 に答える