一道考CSS的题目，求解（最好能说清为什么）_html/css

一道考CSS的题目，求解（最好能说清为什么）_html/css_WEB-ITnose

php中文网

发布： 2016-06-21 09:16:26

原创

1227人浏览过

Consider following markup<html><head><style>   div.main span {color:red}   span.important {color:green}</style></head><body>   <div class="main">       <span class="important" id="myspan">text</span>   </div></body></html>What colour will be applied to word "text" ?

登录后复制

智谱清言 - 免费全能的AI助手

查看详情

回复讨论(解决方案)

div.main span {color:red} //所有DIV下一级class为main和所有是span元素字体颜色为red
span.important {color:green}//所有span的下一级class为 .important的元素字体颜色为green

然后代码是上往下运行如果同个元素重复出现最后显示的是最下面的CSS效果

答案是红色呀？
况且div.main span {color:red} 表示的是类名为main的DIV 下的span文字颜色为red,而不是你说的：所有DIV下一级class为main和所有是span元素字体颜色为red。

以bootstrap的概念?解?的?
div.main span {color:red} 是模版?
span.important {color:green} 是元件?
所以理?套用?色的

如果你要套成?色的
改成?? span.important.important {green;}
??就?大?去了

为红色

因为一个 css的使用优先级
是看  样式名称中分段的类型加起来的数值的大小

div.main span－－》  （元素＋类）＋（元素）
span.important－－》  （元素＋类）

具体类型代表的权重值忘记了  但是上面那个肯定大

http://www.w3cplus.com/css/css-specificity-things-you-should-know.html
CSS权重概念

类名为main的div下的span标签字体颜色为红色。
类名为important的span标签字体颜色为红色。
text结果为红色。
div.main span {color:red}的优先级高于 span.important {color:green}

至于原因…… 我也不知道。。。233

div.main span 两个元素一个类
span.important 一个元素一个类
显然前者的权重大于后者，所以是红色

正解

http://www.w3cplus.com/css/css-specificity-things-you-should-know.html
CSS权重概念

谢谢您了，对我很有帮助

http://www.w3cplus.com/css/css-specificity-things-you-should-know.html
CSS权重概念
哈哈，共同学习，一起进步！

红色啊。。。div main类的作用

id选择器的优先权高于类选择器吧

sorry ,看错了

http://www.w3cplus.com/css/css-specificity-things-you-should-know.html
CSS权重概念

谢谢您了，对我很有帮助客气