1 Прототип htmlстраниц вебприложения 3 2 Синтаксис записи тегов и атрибутов в html 3
Скачать 265.45 Kb.
|
9 Что такое селектор в CSS? (типы селекторов)Селектор - это часть CSS-правила, которая сообщает браузеру, к какому элементу (или элементам) веб-страницы будет применён стиль. Универсальный селектор Соответствует любому HTML-элементу. Например, * {margin: 0;} обнулит внешние отступы для всех элементов сайта. Селектор типа Селекторы элементов позволяют форматировать все элементы данного типа на всех страницах сайта. Например, h1 {font-family: Lobster, cursive;} задаст общий стиль форматирования всех заголовков h1. Селектор класса Селекторы класса позволяют задавать стили для одного и более элементов с одинаковым именем класса, размещенных в разных местах страницы или на разных страницах сайта. Селектор идентификатора Селектор идентификатора позволяет форматировать один конкретный элемент. Значение id должно быть уникальным, на одной странице может встречаться только один раз и должно содержать хотя бы один символ. Селектор потомка Селекторы потомков применяют стили к элементам, расположенным внутри элемента-контейнера. Например, ul li {text-transform: uppercase;} — выберет все элементы li, являющиеся потомками всех элементов ul. Дочерний селектор Дочерний элемент является прямым потомком содержащего его элемента. У одного элемента, может быть, несколько дочерних элементов, а родительский элемент у каждого элемента может быть только один. Дочерний селектор позволяет применить стили только если дочерний элемент идёт сразу за родительским элементом и между ними нет других элементов, то есть дочерний элемент больше ни во что не вложен. Например, p > strong — выберет все элементы strong, являющиеся дочерними по отношению к элементу p. Сестринский селектор Сестринские отношения возникают между элементами, имеющими общего родителя. Селекторы сестринских элементов позволяют выбрать элементы из группы элементов одного уровня: h1 + p — выберет все первые абзацы, идущие непосредственно за любым элементом , не затрагивая остальные абзацы; Селектор атрибута Селекторы атрибутов выбирают элементы на основе имени атрибута или значения атрибута: [атрибут] — все элементы, содержащие указанный атрибут, [alt] — все элементы, для которых задан атрибут alt; Селектор псевдокласса Псевдоклассы — это классы, фактически не прикрепленные к HTML-элементам. Они позволяют применить CSS-правила к элементам при совершении события или подчиняющимся определенному правилу. :link — не посещенная ссылка; :visited — посещенная ссылка; :hover — любой элемент, по которому проводят курсором мыши; Селектор структурных псевдоклассов Структурные псевдоклассы отбирают дочерние элементы в соответствии с параметром, указанным в круглых скобках: :nth-child(odd) — нечётные дочерние элементы; :nth-child(even) — чётные дочерние элементы; Селектор структурных псевдоклассов типа Указывают на конкретный тип дочернего элемента: :nth-of-type() — выбирает элементы по аналогии с :nth-child(), при этом берёт во внимание только тип элемента; Селектор псевдоэлемента Псевдоэлементы используются для добавления содержимого, которое генерируется с помощью свойства content: :first-letter — выбирает первую букву каждого абзаца, применяется только к блочным элементам; 10 Способы подключения каскадной таблицы стилей в html-странице |