老师,能对我这个作业有什么建议吗?

来源: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>&nbsp;<span id="area2One">★★★★★</span>&nbsp;<span id="area2Two">2010-07-26</span></p>

                  <p>有人跟我比赛背台词么</p>

                  <p>阅读:&nbsp;165<a href="#">&nbsp;有用</a></p>

              </div>

              <hr/>

              <!--区域三-->

              <div id="area3">

                  <p><a href="#">十七只猫和鱼</a>&nbsp;<span id="area3One">★★★★</span>&nbsp;<span id="area3Two">2006-04-26</span></p>

                  <p>任何时候任何场合都可以再看一遍的电影</p>

                  <p>阅读:&nbsp;515<a href="#">&nbsp;有用</a></p>

              </div>

              <hr/>

              <!--区域四-->

              <div id="area4">

                  <p><a href="#">暖家男</a>&nbsp;<span id="area4One">★★★★</span>&nbsp;<span  id="area4Two">2006-04-22</span></p>

                  <p>一定有一些电影&nbsp;永远都不能被超越</p>

                  <p>阅读:&nbsp;490&nbsp;<a href="#">有用</a></p>

              </div>

          </div>

    </body>

</html>


写回答

1回答

樱桃小胖子

2017-07-24

整体效果实现的很好,但是建议可以将所有嵌套星星的span标签的id替换成class,然后同一设置一个想同的class,将嵌套日期的span标签的id也可以替换成一个统一的class标签,然后只需要设置一个class就可以设置其余的样式,可以简化代码,有助于代码优化

http://climg.mukewang.com/5975bfc20001258407330341.jpg

http://climg.mukewang.com/5975bfc20001e8ad14620827.jpg

希望可以帮到你!

0
hq__1193
h 谢谢老师,确实你这样做更能简化代码 。学习了。
h017-07-25
共1条回复

0 学习 · 36712 问题

查看课程