选择器和优先级

选择器和优先级

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

<title>CSS运用</title>

<style type="text/css">

  .header,.footer{

      background-color:gray;

      font-size:25px;

  }

  .main{background-color:lightgrey;}

  p span{color:blue;}

  .one{color:gray;}

  a:link{color:green;}

  a:hover{color:blue;}

  ul li{color:green;}

  ol li{color:red;}

  #one3{color:orange;}

</style>

</head>

<body>

<div class="header">慕课网</div>

<div class="main">

    <div>

<p><span>HTML超文本标记语言</span>,“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。</p>

<p class="one">课程内容</p>

<ul>

<li><a href="#">html基础标签</a>

<ol>

<li>段落标签</li>

<li>图像和超链接标签</li>

<li>列表标签</li>

</ol>

</li>

<li>html表格标签</li>

<li>html表单标签</li>

</ul>

</div>

<div>

<p><span>CSS层叠样式表</span>(Cascading Style Sheets),样式定义如何显示HTML元素。</p>

<p class="one">课程内容</p>

<ul>

<li><a href="#">CSS基础语法</a></li>

<li>CSS使用方法

<ol>

<li>行内样式</li>

<li>内部样式</li>

<li>外部样式</li>

</ol>

</li>

<li>CSS选择器

<ul id="one3">

<li>ID选择器</li>

<li>class选择器</li>

<li>标签选择器</li>

</ul>

</li>

</ul>

</div>

</div>

<div class="footer">慕课网 只学有用的</div>

</body>

</html>

为啥橙色的字用id选择器 和class选择器都不能实现,!improtant也没用,但是用div ul li ul li后代选择器却能实现,这是为什么啊


正在回答

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

2回答

因为#one3是给ul加的,li是ul的子元素,如果li没有去制定颜色的话会继承ul的颜色,但是li一旦自己设置有颜色,就不会继承父元素的字体颜色了。

祝学习愉快!

sherryliu 2017-09-06 10:07:31

http://img1.sycdn.imooc.com/climg//59af57de0001c9a509790491.jpg

http://img1.sycdn.imooc.com/climg//59af57e40001e61109420400.jpg

ul li{color:green;}

#one3{color:orange;}

第一个特定到li,第二个特定到ul,继承到li,特定性大于继承性,以第一个为准

  • 提问者 婵在叫丨人坏掉 #1
    没懂.特定性是啥
    2017-09-06 13:58:04
  • sherryliu 回复 提问者 婵在叫丨人坏掉 #2
    第一个规定儿子是绿色的,第二个规定爸爸是橙色的,那你说儿子应该是什么颜色
    2017-09-06 14:11:57
  • sherryliu 回复 提问者 婵在叫丨人坏掉 #3
    ul li{color:green;}明确规定所有ul下的所有li元素是绿色;#one3{color:orange;}明确规定id为one3的ul元素为橙色,那么它的子代元素li继承了ul的橙色。子元素li一个是明确的规定绿色,一个是继承来的橙色,当然以规定为准,跟父元素的权值没关系。遗产当然是以遗书为准啦,没有遗书才继承。
    2017-09-06 14:27:49
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

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