求助!!!在html中引用外部样式表问题!

各位高手:因最近在自学html和CSS创建网页,现遇到问题被卡住了,还请高手们指点下,多谢了!问题:在引用外部样式表时我按书上的说明操作为何老是引用不到,就是浏览器根本没... 各位高手:因最近在自学html和CSS创建网页,现遇到问题被卡住了,还请高手们指点下,多谢了!
问题:在引用外部样式表时我按书上的说明操作为何老是引用不到,就是浏览器根本没反应的!或者说样式表根本没起作用!
简要的代码如下:(aaa.html)
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>如何引用样式表说明</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<div class="one">one
</div>
<div class="two">two</div>
<div clsss="three">three</div>
<div class="four">four</div>
</body>
</html>

样式表如下:(styles.css)
div ｛
position:relative;
width:250px;
height:100px;
border:10px single black;
color:black;
text-align:center;
｝
div.one｛
background-color:red;
｝
div.two｛
background-color:green;
｝
div.three｛
background-color:blue;
｝
div.four｛
background-color:yellow;
｝
现是确保样式表是和aaa.html在同一目录下的, 但现在打开aaa.html网页是只在IE 上看到如下屏幕:
one
two
three
four

根本不是我在样式表中设置的一样!哪位高手告诉一下哪里出了问题吗?为什么不显示我在样式表中所设置的呢? 展开

 我来答

3个回答

#热议# 不吃早饭真的会得胆结石吗？

天才没有学才广
推荐于2016-05-14 · 超过50用户采纳过TA的回答

知道答主

回答量：139

采纳率：0%

帮助的人：0

我也去答题访问个人页

关注

展开全部

utf-8。样式表文件要保存为这个格式。如果是dw做的。他生成的多办是gb2132。默认是这样。
另外书上很多东西不是正确的（垃圾书很多）,比如：

div.one｛
background-color:red;
｝这个就是个垃圾。问题在于两个细节。
一系统定义为所有div标签套接样式div(全局变量）另一方面又用 “."定义子类。这样会有冲突。最佳方法：
全局变量
body{color:字体色;font-size:字体大小什么的。}
div{这个没有必要}
定义类：.one{这里有个问题是padding和margin两个属性}
如果你只用margin支持IE。但有时在其它浏览器显示不对。
那么说了这么多。总得给你解决问题吧。我把做好的加进去了。你调试。要是有问题。你拿刀砍我。
显示页代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<link rel="stylesheet" type="text/css" href="css.css">
<title>我的修改后的内容</title>
</head>

<body>
<div id="div">
<div class="one">one</div>
<div class="two">two</div>
<div class="three">three</div>
<div class="four">four</div>
</div>
</body>
</body>
</html>

css代码//注意href="css.css为名

/*定义系统总变量*/
body{ text-align:center; font-size:12px; font-family:"宋体"; color:#FF3300;}

/*div ｛ position:relative;width:250px; height:100px; border:10px single black;color:black;
text-align:center;
｝这个我不能说是垃圾，至少是很不好*/
#div{ width:250px; height:100px; margin:0px; border:#000000 solid 10px;}/*定义边框为10的黑边高100*/
.one{float:left; clear:left; width:60px; height:95px; background:#006666; color:#FFFFFF;}
.two{float:left; width:60px; height:95px; background:#CC3333; color:#00FF00;}
.three{float:left; width:60px; height:95px; background: #66CC00; color:#990000;}
.four{float:right; width:45px; height:95px; background:#666600; color:#000033;}
/*为了区别每一行我用不同的字体色*/
/* 四列并行注意最后一行。我留了一个与左边有点间距为5像素*/