[英]Why won't my HTML link up with my CSS?
我正在在线学习教程,但似乎无法将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;
}
您的HTML无效。 您的HTML中缺少<body>
标记,这可能是问题的根源。 如果没有,则还应该在页面顶部提供一个文档类型。 使您的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>
如果您确实有此文件:
tut.css
并且它与tut.html
处于同一文件夹中,因此,您的HTML / CSS必须正确运行,因为它在所有浏览器中都可以正常工作。 也许您已经使用以下名称保存了CSS文件: tut.css.txt
。
如果您使用的是Windows,请按照以下说明操作以确保文件名:
View
菜单上,选择Folder and Search Options
View
选项卡中,双选此选项: 隐藏已知文件类型的扩展名 现在,您必须看到css文件的完整名称。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.