老师,能对我这个作业有什么建议吗?
来源:4-2 编程练习
qq__1193
2017-07-24 15:34:31
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>文本样式</title>
<style type="text/css">
/*样式添加*/
#body{border:1px gray solid;border-right:none;font-size:16px;}
#area2,#area3,#area4{height:99px;}
#area1{
height:85px;
}
#area1 h1{font-size:1.3em;font-weight:bold;color:green;}
#area1 a{text-decoration:none;vertical-align:-5px;}
#area1 p{word-spacing:-10px;line-height:2.6em;}
#area2 a,#area3 a,#area4 a{text-decoration:none;}
#area2 span#area2One,#area3 span#area3One,#area4 span#area4One{color:orange;}
#area2 span#area2Two,#area3 span#area3Two,#area4 span#area4Two{font-weight:200;}
</style>
</head>
<body>
<!-- 写出h内容 -->
<div id="body">
<!--区域一-->
<div id="area1">
<h1>大话西游之大圣娶亲的影评</h1>
<p>
<a href="#">热门/</a>
<a href="#">最新/</a>
<a href="#">好友</a>
</p>
</div>
<hr/>
<!--区域二-->
<div id="area2">
<p><a href="#">罗弘霉素</a> <span id="area2One">★★★★★</span> <span id="area2Two">2010-07-26</span></p>
<p>有人跟我比赛背台词么</p>
<p>阅读: 165<a href="#"> 有用</a></p>
</div>
<hr/>
<!--区域三-->
<div id="area3">
<p><a href="#">十七只猫和鱼</a> <span id="area3One">★★★★</span> <span id="area3Two">2006-04-26</span></p>
<p>任何时候任何场合都可以再看一遍的电影</p>
<p>阅读: 515<a href="#"> 有用</a></p>
</div>
<hr/>
<!--区域四-->
<div id="area4">
<p><a href="#">暖家男</a> <span id="area4One">★★★★</span> <span id="area4Two">2006-04-22</span></p>
<p>一定有一些电影 永远都不能被超越</p>
<p>阅读: 490 <a href="#">有用</a></p>
</div>
</div>
</body>
</html>
1回答
整体效果实现的很好,但是建议可以将所有嵌套星星的span标签的id替换成class,然后同一设置一个想同的class,将嵌套日期的span标签的id也可以替换成一个统一的class标签,然后只需要设置一个class就可以设置其余的样式,可以简化代码,有助于代码优化
希望可以帮到你!
相似问题
回答 1
回答 2