Главная страница
Навигация по странице:

  • 10 Способы подключения каскадной таблицы стилей в html-странице Таблицу стилей CSS можно добавить к HTML элементам тремя способами: с помощью атрибута style


  • 1 Прототип htmlстраниц вебприложения 3 2 Синтаксис записи тегов и атрибутов в html 3


    Скачать 265.45 Kb.
    Название1 Прототип htmlстраниц вебприложения 3 2 Синтаксис записи тегов и атрибутов в html 3
    Дата04.04.2023
    Размер265.45 Kb.
    Формат файлаdocx
    Имя файлаEkzamenatsionnye_voprosy.docx
    ТипДокументы
    #1037669
    страница4 из 9
    1   2   3   4   5   6   7   8   9

    9 Что такое селектор в CSS? (типы селекторов)


    Селектор - это часть CSS-правила, которая сообщает браузеру, к какому элементу (или элементам) веб-страницы будет применён стиль.

    Универсальный селектор

    Соответствует любому HTML-элементу. Например, * {margin: 0;} обнулит внешние отступы для всех элементов сайта.

    Селектор типа

    Селекторы элементов позволяют форматировать все элементы данного типа на всех страницах сайта. Например, h1 {font-family: Lobster, cursive;} задаст общий стиль форматирования всех заголовков h1.

    Селектор класса

    Селекторы класса позволяют задавать стили для одного и более элементов с одинаковым именем класса, размещенных в разных местах страницы или на разных страницах сайта.

    Селектор идентификатора

    Селектор идентификатора позволяет форматировать один конкретный элемент. Значение id должно быть уникальным, на одной странице может встречаться только один раз и должно содержать хотя бы один символ.

    Селектор потомка

    Селекторы потомков применяют стили к элементам, расположенным внутри элемента-контейнера. Например, ul li {text-transform: uppercase;} — выберет все элементы li, являющиеся потомками всех элементов ul.

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

    Дочерний элемент является прямым потомком содержащего его элемента. У одного элемента, может быть, несколько дочерних элементов, а родительский элемент у каждого элемента может быть только один. Дочерний селектор позволяет применить стили только если дочерний элемент идёт сразу за родительским элементом и между ними нет других элементов, то есть дочерний элемент больше ни во что не вложен.

    Например, p > strong — выберет все элементы strong, являющиеся дочерними по отношению к элементу p.

    Сестринский селектор

    Сестринские отношения возникают между элементами, имеющими общего родителя. Селекторы сестринских элементов позволяют выбрать элементы из группы элементов одного уровня:

    Селектор атрибута

    Селекторы атрибутов выбирают элементы на основе имени атрибута или значения атрибута:

    • [атрибут] — все элементы, содержащие указанный атрибут, [alt] — все элементы, для которых задан атрибут alt;

    Селектор псевдокласса

    Псевдоклассы — это классы, фактически не прикрепленные к HTML-элементам. Они позволяют применить CSS-правила к элементам при совершении события или подчиняющимся определенному правилу.

    • :link — не посещенная ссылка;

    • :visited — посещенная ссылка;

    • :hover — любой элемент, по которому проводят курсором мыши;

    Селектор структурных псевдоклассов

    Структурные псевдоклассы отбирают дочерние элементы в соответствии с параметром, указанным в круглых скобках:

    • :nth-child(odd) — нечётные дочерние элементы;

    • :nth-child(even) — чётные дочерние элементы;

    Селектор структурных псевдоклассов типа

    Указывают на конкретный тип дочернего элемента:

    • :nth-of-type() — выбирает элементы по аналогии с :nth-child(), при этом берёт во внимание только тип элемента;

    Селектор псевдоэлемента

    Псевдоэлементы используются для добавления содержимого, которое генерируется с помощью свойства content:

    • :first-letter — выбирает первую букву каждого абзаца, применяется только к блочным элементам;

    10 Способы подключения каскадной таблицы стилей в html-странице
    Таблицу стилей CSS можно добавить к HTML элементам тремя способами:

    • с помощью атрибута style в HTML-элементах (встроенный или строчный);

    • с помощью тега

    1   2   3   4   5   6   7   8   9


    написать администратору сайта