SovaWiki

Инструменты пользователя

Инструменты сайта

Вы посетили:
css:selectors

Различия

Показаны различия между двумя версиями страницы.

Ссылка на это сравнение

Предыдущая версия справа и слеваПредыдущая версия
Следующая версия		Предыдущая версия
css:selectors [2022/11/10 10:30] – [Основные виды селекторов] so_v_acss:selectors [2026/08/06 09:25] (текущий) – so_v_a
Строка 1: Строка 1:
 +<!DOCTYPE markdown>
 +
 # CSS. Селекторы # CSS. Селекторы
 +
 ## Основные виды селекторов ## Основные виды селекторов
  
Строка 22: Строка 25:
 ``` ```
  – элемент **a** с данным **id**, классами **c1** и **c2**, и псевдоклассом **visited**  – элемент **a** с данным **id**, классами **c1** и **c2**, и псевдоклассом **visited**
- 
  
 ## Отношения ## Отношения
Строка 42: Строка 44:
 div ~ p  div ~ p 
 ``` ```
- – правые соседи: все p на том же уровне вложенности, которые идут после div. + – правые соседи: все p на том же уровне вложенности, которые идут после div.   
- +
 ```css ```css
 div + p div + p
 ``` ```
-  – первый правый сосед: p на том же уровне вложенности, который идёт **сразу после** div (если есть).+ – первый правый сосед: p на том же уровне вложенности, который идёт **сразу после** div (если есть). 
  
 ## Фильтр по месту среди соседей ## Фильтр по месту среди соседей
Строка 64: Строка 67:
  - :nth-child(3n+2) даст элементы номер 2, 5, 8 и так далее.  - :nth-child(3n+2) даст элементы номер 2, 5, 8 и так далее.
  
-- `:nth-last-child(a)`, `:nth-last-child(an+b)` – то же самое, но отсчёт начинается с конца. Например:  +- **:nth-last-child(a)**, **:nth-last-child(an+b)** – то же самое, но отсчёт начинается с конца. Например: 
- - `:nth-last-child(2)` – второй элемент с конца.+  * Элемент ненумерованного списка: `:nth-last-child(2)` – второй элемент с конца.
  
  
Строка 79: Строка 82:
  
 Они имеют в точности тот же смысл, что и обычные :first-child, :last-child и так далее, но во время подсчёта игнорируют элементы с другими тегами, чем тот, к которому применяется фильтр. Они имеют в точности тот же смысл, что и обычные :first-child, :last-child и так далее, но во время подсчёта игнорируют элементы с другими тегами, чем тот, к которому применяется фильтр.
- 
  
 ## Селекторы атрибутов ## Селекторы атрибутов
  
 На атрибут целиком: На атрибут целиком:
 +
 - [attr] – атрибут установлен, - [attr] – атрибут установлен,
 - [attr="val"] – атрибут равен val. - [attr="val"] – атрибут равен val.
  
 На начало атрибута: На начало атрибута:
 +
 - [attr^="val"] – атрибут начинается с val, например "value". - [attr^="val"] – атрибут начинается с val, например "value".
 - [attr|="val"] – атрибут равен val или начинается с val-, например равен "val-1". - [attr|="val"] – атрибут равен val или начинается с val-, например равен "val-1".
  
 На содержание: На содержание:
 +
 - [attr*="val"] – атрибут содержит подстроку val, например равен "myvalue". - [attr*="val"] – атрибут содержит подстроку val, например равен "myvalue".
 -  [attr~="val"] – атрибут содержит val как одно из значений через пробел. Например:  -  [attr~="val"] – атрибут содержит val как одно из значений через пробел. Например: 
Строка 100: Строка 105:
  
 На конец атрибута: На конец атрибута:
 +
 - [attr$="val"] – атрибут заканчивается на val, например равен "myval". - [attr$="val"] – атрибут заканчивается на val, например равен "myval".
  
Строка 115: Строка 121:
 ## Псевдоэлементы ::before, ::after ## Псевдоэлементы ::before, ::after
  
-«Псевдоэлементы» – различные вспомогательные элементы, которые браузер записывает или может записать в документ.+«[[psevdoelement|Псевдоэлементы]]» – различные вспомогательные элементы, которые браузер записывает или может записать в документ.
  
 При помощи псевдоэлементов ::before и ::after можно добавлять содержимое в начало и конец элемента. При помощи псевдоэлементов ::before и ::after можно добавлять содержимое в начало и конец элемента.
  
- 
-#css  
  
/var/www/html/dokuwiki/data/attic/css/selectors.1668076216.txt.gz · Последнее изменение: (внешнее изменение)