Что означает> в CSS?

В файле cUI IUI они используют следующие селекторы:

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

Что означают значки > , *: not() и * []?

Спасибо.

Ответ 1

> означает " является дочерним элементом". Итак, body > *:not(.toolbar) соответствует *:not(.toolbar), который является дочерним элементом body.

*:not(.toolbar) соответствует любому элементу, который не имеет класса .toolbar.

*[selected="true"] соответствует любому элементу с атрибутом selected, равным true.

Имейте в виду, что последние два (*:not() и *[] являются частью спецификации CSS3, и вы обычно не можете полагаться на них для кросс-браузерной совместимости CSS. Однако они полностью поддерживаются в WebKit, что и использует iPhone (и, следовательно, iUI).

Ответ 2

> означает прямой дочерний
* - универсальный селектор (все)
: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"

> и * определены в спецификации CSS 2.1. Псевдокласс :not и селектор [] определены в спецификации CSS 3.

Смотрите: http://www.w3.org/TR/CSS21/selector.html и http://www.w3.org/TR/css3-selectors/для получения дополнительной информации.

Ответ 3

означает дочерний элемент

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

Ответ 4

> - Селектор для детей

т.е.
```
div > p > b {
 font-size:100px;
}
```
Это выберет все теги b внутри тегов p внутри тегов div.
:not(..) - не селектор

Соответствует любому элементу страницы, который не соответствует критериям в скобках оператора not. то есть.
```
div:not(.toolbar)
```
Будет соответствовать любому div, у которого нет панели инструментов класса
[attr='val'] - селектор атрибутов

Это соответствует любому элементу, где атрибут соответствует указанному значению. Пример, если вы хотите сделать все отмеченные флажки красными.
```
input[checkec='true'] {
  background-color:red;
}
```

Для получения дополнительной информации вы должны использовать селекторы Google CSS 2.1.