在IUI的CSS文件中,它们使用了以下选择器:
body > *:not(.toolbar)
body > *[selected="true"]
">", "*:not()"和"*[]"是什么意思?
谢谢。
在IUI的CSS文件中,它们使用了以下选择器:
body > *:not(.toolbar)
body > *[selected="true"]
">", "*:not()"和"*[]"是什么意思?
谢谢。
>
表示直接子元素*
是通用选择器(所有元素):not()
表示除了括号内的元素以外的任何元素*[]
表示匹配括号中内容的任何元素针对您的情况:
body > *:not(.toolbar) // means any element immediately under the body tag that isn't of class .toolbar
body > *[selected="true"] // means any element immediately under the body tag where the selected attribute is "true"
< p >>
和*
在CSS 2.1规范中有定义。而:not
伪类和[]
选择器则在CSS 3规范中有定义。详见:http://www.w3.org/TR/CSS21/selector.html 和 http://www.w3.org/TR/css3-selectors,获取更多信息。
>
- Child selector
I.e.
div > p > b {
font-size:100px;
}
This will select all b
tags inside p
tags inside div
tags.
:not(..)
- not selector
Matches any element on the page that does not meet the criteria in the parenthesis of the not statement. i.e.
div:not(.toolbar)
Will match any div that does not have the class toolbar
[attr='val']
- attribute selector
This matches any element where the attribute matches the specified value. Example if you want to make all checked check boxes red.
input[checkec='true'] {
background-color:red;
}
您可以通过谷歌搜索CSS 2.1选择器来获取更多信息。
.cont > div {
color: #fff;
}
<div class="cont">
<!-- NOTE: THIS NOTE IS TO TELL YOU WHICH IT AFFECTS
It only affects the below div. Not the p.
so "jabberwocky" text would be white, but "lorem ipsum" text in the p, would be the default font color. -->
<div>jabberwocky</div>
<p>lorem ipsum</p>
</div>