CSS Селекторы: Полное руководство | Все селекторы в одном уроке
💥 Все курсы в одном комплекте: https://webdesign-master.ru/courses/b...
Сегодня мы рассмотрим все существующие CSS селекторы для более грамотной выборки HTML элементов при стилизации. В качестве препроцессора, для удобства, будем использовать Sass. Страница урока: https://webdesign-master.ru/blog/html...
Таймкоды: 00:00 Начало урока 00:55 .class (class) 02:00 section (element) 03:02 id 03:50 Каскад CSS элементов 05:09 Список CSS элементов 06:05 Дочерний CSS элемент, длинна каскада 11:20 Следующий за селектором CSS элемент (+) 12:57 Все элементы после определенного (~) 15:00 Универсальный селектор (*) 15:42 Первое слово в значении атрибута до тире ([attribute|=value]) 18:17 Подстрока в начале значения атрибута ([attribute^=value]) 19:59 Подстрока в конце значения атрибута ([attribute$=value]) 20:52 Подстрока в значении атрибута ([attribute*=value]) 21:30 Активный CSS элемент и элемент с фокусом (:active и :focus) 23:12 Псевдоэлементы ::after и ::before 25:52 input:checked 27:15 input:disabled 28:47 Пустой элемент (:empty) 30:20 Исключаемые CSS элементы (:not) 31:10 input:enabled 31:34 Первый элемент набора (:first-child) 21:12 Последний элемент набора (:last-child) 33:30 Первая буква текста внутри CSS элемента (::first-letter) 33:55 Первая строка текста внутри CSS элемента (::first-line) 34:20 Первый элемент набора определенного типа (:first-of-type) 35:21 Последний элемент набора определенного типа (:last-of-type) 35:31 Поведение элемента при наведении курсора мыши (:hover) 35:52 input:invalid 36:58 Порядковый номер элемента (:nth-child) 39:30 Порядковый номер элемента по типу (:nth-of-type) 40:45 Только дочерний элемент (:only-child) 41:26 input:optional 41:53 Превышение ограничений в input (:out-of-range) 42:29 input:read-only 43:08 input:read-write 43:33 :target 46:27 :visited ВКонтакте: https://vk.com/jediweb
Телеграм: https://t.me/jediweb
Дзен: https://dzen.ru/jediweb