老师 这个圈出来的地方实现不了。麻烦给讲解下

老师 这个圈出来的地方实现不了。麻烦给讲解下

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

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


正在回答 回答被采纳积分+1

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

2回答
好帮手慕粉 2019-09-24 19:24:02

同学你好

(1)#colororange是加在ul上的,那橘色的颜色对于li来说是通过继承得到的,所以是继承的权重,而继承的权重是小于标签权重的,所以li显示的是绿色

(2)由于在a标签内设置了行内样式,颜色为绿色,而a:hover伪类,class类和标签的权重加一块都没有行内的权重高,所以蓝色不会生效

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

好帮手慕粉 2019-09-24 15:15:18

同学你好,问题中一共有以下几点

(1)橙色实现不了的原因是#colororange这个样式是加给ul的,而li的样式是继承于上面的样式的

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

建议参考:

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

这样#colororange的权重就会比较高,样式就可以加载li上面。

(2)鼠标放a标签上变成蓝色实现不了的原因也是权重问题,给它加上一个!important就可以解决啦

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

希望我的回答能够帮助到你,望采纳,祝学习愉快!

  • 提问者 我的乖乖隆地洞 #1
    实现了。 不过 (1)的问题单个ID选择器权重比 2个标签选择器的权重要高啊,为什么选不中 (2)的问题我已经标明到了ul1,ul2里的li 下面的a标签,为什么还是选不中
    2019-09-24 15:50:51
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

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