Руководство по CSS

CSS @правила (RULES)

Полный список свойств CSS

Функции CSS Полное руководство по селекторам CSS

CSS > Дочерний селектор

Использование 　> селектора для разделения двух элементов, он будет соответствовать только тем, которые являются прямыми потомками первого элемента (дочерними элементами). В сравнении с этим, когда два элемента соединены селектором потомка, он означает соответствие всем элементам, которые являются потомками первого элемента (но не обязательно родителями), независимо от того, сколько раз они "прыгают" в DOM.

Полное руководство по CSS-селекторам

Онлайн пример

Выберите все элементы <p>, которые являются детьми элементов <div>:

Пример

<!DOCTYPE　html>
<html>
<title>Учебный сайт по основам (oldtoolbag.com)</title>
<head>
<style>
div>p
{
background-color:red;
color:white;
}
div　>　span　{background-color:　DodgerBlue;}
</style>
</head>
<body>
<h1>Добро пожаловать на учебный сайт по основам (ru.oldtoolbag.com)</h1>
<div>
<p>Наш адрес сайта: ru.oldtoolbag.com.</p>
<p>Название нашего сайта: Учебный сайт по основам.</p>
<span>Демонстрация дочернего селектора</span>
</div>
<p>Мы предоставляем различные базовые учебные материалы, изучите основы, и вы сможете идти дальше!</p>
</body>
</html>

Проверьте,看看 ‹/›

Определение и использование

Элемент1　>　Элемент2　{назначение стиля　}

element>element Дочерний селектор используется для выбора определенного родительского элемента.

Внимание: Элемент не может быть выбран напрямую, чтобы определить его родительский элемент.

Совместимость браузеров

IEFirefoxOperaChromeSafari

Все основные браузеры поддерживают element>element Дочерний селектор.

Внимание:element>elementВ IE8 для работы необходимо объявить <!DOCTYPE>

Полное руководство по CSS-селекторам

Функции CSS Полное руководство по селекторам CSS