请问5-4编程练习这样写是否简洁与规范呢?

请问5-4编程练习这样写是否简洁与规范呢?

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
  <title>CSS运用</title>
  <style type="text/css">
     .header,.footer{font-size:30px;background-color:gray;}
     .main{background-color:lightgray;}
     .title{color:blue;
            font-size:20px;}
     .content-title{color:gray;}
     a:link{color:green;}
     a:hover{color:blue;}
     .content-ol li{color:red !important;}
     .content li{color:green;}
     .css-selctor li{color:orange;}
  </style>
</head>
<body>
<div class="header">慕课网</div>
<div class="main">
    <div>
    <p><span class="title">HTML超文本标记语言</span>,“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。</p>
    <p class="content-title">课程内容</p>
    <ul class="content">
      <li><a href="#">html基础标签</a>
        <ol class="content-ol">
          <li>段落标签</li>
          <li>图像和超链接标签</li>
          <li>列表标签</li>
        </ol>
      </li>
      <li>html表格标签</li>
      <li>html表单标签</li>
    </ul>     
  </div>
  <div>
    <p><span class="title">CSS层叠样式表</span>(Cascading Style Sheets),样式定义如何显示HTML元素。</p>    
    <p class="content-title">课程内容</p>
    <ul class="content">
      <li><a href="#">CSS基础语法</a></li>
      <li>CSS使用方法
        <ol  class="content-ol">
          <li>行内样式</li>
          <li>内部样式</li>
          <li>外部样式</li>
        </ol>
      </li>
      <li>CSS选择器
        <ul class="css-selctor">
          <li>ID选择器</li>
          <li>class选择器</li>
          <li>标签选择器</li>
        </ul>
      </li>
    </ul>     
  </div>
</div>
<div class="footer">慕课网 只学有用的</div>
</body>
</html>

正在回答

登陆购买课程后可参与讨论,去登陆

2回答

你好同学 ,因为a标签中的href值为# ,这个链接访问过就不会变为绿色了  (会受浏览器缓存影响) . 所以本练习给a设置一个默认的颜色会更好一点 . 当然 ,同学如果想要使用:link设置绿色也是可以的 .

祝学习愉快 ,望采纳 .

好帮手慕夭夭 2019-01-03 11:07:05

你好同学 , 如下红框中文字也要设置为绿色:

http://img1.sycdn.imooc.com//climg/5c2d7c0f00012fdd04090251.jpg

如下设置 ,与前面的选择器逗号隔开 , 共有一个样式 :

http://img1.sycdn.imooc.com//climg/5c2d7c3000014afc03790055.jpg

祝学习愉快 ,望采纳 .


  • 提问者 Yabel #1
    我这里链接文字未点击的时候,的确显示绿色,不是像您截图中的紫色。所以还需要在.content li后面加,a吗?
    2019-01-03 21:41:49
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师