CSS中的>是什么意思？

Question

CSS中的>是什么意思？

22

在IUI的CSS文件中，它们使用了以下选择器：

body > *:not(.toolbar)
body > *[selected="true"]

">", "*:not()"和"*[]"是什么意思？

谢谢。

- Jon

18

如果我们必须跳过那些谷歌可以回答的问题，那么我们就没有回答任何问题。我们来这里是为了收集和改进现有的内容，而不仅仅是创造原始内容。 - Stefano Borini

可能是CSS规则中的“>”是什么意思？的重复问题。 - Cody Gray

4个回答

19

> 表示直接子元素
* 是通用选择器（所有元素）
: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，获取更多信息。

- Damovisa

2

> - 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选择器来获取更多信息。

- gatapia

2

意思是子元素。

.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>

- user1558952

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Marc W · Accepted Answer

"

> 表示“是父元素”。因此，body > *:not(.toolbar) 匹配 *:not(.toolbar) 这个子元素是 body 的。

*:not(.toolbar) 匹配任何没有类名为 .toolbar 的元素。

*[selected="true"] 匹配任何带有属性 selected 并且值为 true 的元素。

请注意，最后两个（*:not() 和 *[]）是 CSS3规范的一部分，通常不能依赖它们来实现跨浏览器的 CSS 兼容性。但是，在 WebKit 中完全支持它们，这也是 iPhone（以及 iUI）所使用的。

"