|
|
| Статистика |
Онлайн всего: 1 Гостей: 1 Пользователей: 0 |
|
Селекторы CSS3
Селекторы CSSВ CSS, шаблоны селекторов используются для выбора элемента(ов), которые вы хотите стилизовать. Колонка "CSS" указывает, в какой версии CSS свойство определено (CSS1, CSS2 или CSS3). | Селектор | Пример | Пример селекторов: | CSS |
|---|
| .class | .intro | Все элементы с class="intro" | 1 | | #id | #firstname | Элемент с id="firstname" | 1 | | * | * | Все элементы | 2 | | element | p | Все элементы <p> | 1 | | element,element | div,p | Все элементы <div> и все элементы <p> | 1 | | element element | div p | Все элементы <p> внутри <div> | 1 | | element>element | div>p | Все элементы <p> где родитель является элементом <div> | 2 | | element+element | div+p | Все элементы <p> находящиеся сразу за элементом <div> | 2 | | [attribute] | [target] | Все элементы с атрибутом target | 2 | | [attribute=value] | [target=_blank] | Все элементы с атрибутом target равным "_blank" | 2 | | [attribute~=value] | [title=flower] | Все элементы с атрибутом title, который включает слова разделенные пробелом, одно из которых "flower" | 2 | | [attribute|=language] | [lang|=en] | Все элементы где значение атрибута lang является "en", даже если значение включает дефис (-), как "en-us" | 2 | | :link | a:link | Все ссылки (|<a> элементы с href) | 1 | | :visited | a:visited | Все посещенные ссылки | 1 | | :active | a:active | Активные ссылки | 1 | | :hover | a:hover | Ссылки на прохождение мышкой | 1 | | :focus | input:focus | Фокусируемые элементы ввода | 2 | | :first-letter | p:first-letter | Первая буква всех элементов <p> | 1 | | :first-line | p:first-line | Первая строка всех элементов <p> | 1 | | :first-child | p:first-child | Все элементы <p>, которые являются первым потомком их родителей | 2 | | :before | p:before | Содержание будет помещено до каждого элемента <p> | 2 | | :after | p:after | Содержание будет помещено после каждого элемента <p> | 2 | | :lang(language) | p:lang(it) | Все элементы <p> с атрибутом lang, включающим "it" | 2 |
| Селектор | Пример | Пример селекторов: | CSS |
|---|
| [attribute^=value] | a[src^="https"] | Все элементы с атрибутом src, значение которых начинается с "https" | 3 | | [attribute$=value] | a[src$=".pdf"] | Все элементы с атрибутом src, значение которых заканчивается на ".pdf" | 3 | | [attribute*=value] | a[src*="xhtml"] | Все элементы с атрибутом src, значение которых содержит "xhtml" | 3 | | :first-of-type | p:first-of-type | Все элементы p, которые являются первым элементом p их родителей | 3 | | :last-of-type | p:last-of-type | Все элементы p, которые являются последним элементом p их родителей | 3 | | :only-of-type | p:only-of-type | Все элементы p, которые являются единственным элементом p их родителей | 3 | | :only-child | p:only-child | Все элементы p, которые являются единственным элементом их родителей | 3 | | :nth-child(n) | p:nth-child(2) | Все элементы p, которые являются вторым ребенком их родителей | 3 | | :nth-last-child(n) | p:nth-last-child(2) | Все элементы p, которые являются предпоследним ребенком их родителей | 3 | | :nth-of-type(n) | p:nth-of-type(2) | Все элементы p, которые являются вторым ребенком p их родителей | 3 | | :nth-last-of-type(n) | p:nth-last-of-type(2) | Все элементы p, которые являются предпоследним ребенком p их родителей | 3 | | :last-child | p:last-child | Все элементы p, которые являются последним ребенком их родителей | 3 | | :root | :root | Корневой элемент документа | 3 | | :empty | p:empty | Все элементы p, которые не имеют детей (включая текстовые блоки) | 3 | | :target | #news:target | Текущий активный элемент #news (нажатие на URL, содержит это имя якоря) | 3 | | :enabled | input:enabled | Все доступные элементы ввода | 3 | | :disabled | input:disabled | Все недоступные элементы ввода | 3 | | :checked | input:checked | Все отмеченные флажки | 3 | | :not(selector) | :not(p) | Все элементы, которые не элементы p | 3 | | ::selection | ::selection | Выбор части элемента, которая выбирается пользователем | 3 |
|
| Категория: Css 3 | Добавил: ChronoW (09.07.2013)
|
| Просмотров: 721
| Теги:
| Рейтинг: 5.0/1 |
|
|