求助!!!在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
根本不是我在样式表中设置的一样!哪位高手告诉一下哪里出了问题吗?为什么不显示我在样式表中所设置的呢? 展开
问题:在引用外部样式表时我按书上的说明操作为何老是引用不到,就是浏览器根本没反应的!或者说样式表根本没起作用!
简要的代码如下:(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
根本不是我在样式表中设置的一样!哪位高手告诉一下哪里出了问题吗?为什么不显示我在样式表中所设置的呢? 展开
展开全部
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像素*/
另外书上很多东西不是正确的（垃圾书很多）,比如：
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像素*/
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你的代码没有问题,样式表也没有问题,但我把销友你坦斗亏代码复制下来让神,发现你用的"｛"和"｝"号是全角而不是正规的半角英文符号"{"和"}"号,修改了就正常了.你可以改了试试.
另外如果你怕没引用到外部样式表的话,可以用个<style></style>把样式表放在内部试试.
另外如果你怕没引用到外部样式表的话,可以用个<style></style>把样式表放在内部试试.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
就是上面那位仁兄所说的一样，
把div .one及其它的，前面的div去掉
把div .one及其它的，前面的div去掉
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
