Page 50 - 6108
P. 50

–  Сестринський  селектор.  Сестринські  відносини  виникають  між
               елементами,  що  мають  загального  батька.  Селектори  сестринських  елементів
               дозволяють вибрати теги з групи елементів одного рівня.
                      h1 + p – вибере всі перші абзаци, що йдуть безпосередньо за будь-яким
               тегом <h1>, не зачіпаючи решта абзаців.
                      h1 ~ p – вибере всі абзаци, які є сестринськими по відношенню до будь-
               якого заголовку h1 і йдуть після нього.
                      –  Селектор  Атрибута.  Селектори  атрибутів  дозволяють  форматувати
               елементи  на  основі  вибірки  будь-яких  містяться  в  них  атрибутів  або  значень
               атрибутів, варіанти:
                      [атрибут] – вибирає всі елементи, для яких заданий вказаний атрибут.
                      img [alt] – вибирає всі картинки, що містять атрибут alt.

                      img [title = "flower"] – вибирає всі картинки, назва яких містить
               слово flower.
                      –  Псевдоклас.  Псевдокласи  –  це  класи,  що  фактично  не  прикріплені  до
               тегів html-коду. Вони викликають CSS-правила при вчиненні тої чи іншої події
               або підкоряються певному правилу:
                      a: link – посилається на невідвідуване посилання.
                      a: visited – посилається на вже відвідане посилання.
                      a:  hover  –  посилається  на  будь-який  елемент,  над  яким  проводять
               курсором миші.
                      a:  focus  –  посилається  на  будь-який  елемент,  над  яким  знаходиться
               курсор миші.
                      a:  active  –  посилається  на  елемент,  який  був  активізований
               користувачем.
                      – Структурні псевдокласи. Структурні псевдокласи форматують дочірні

               елементи відповідно до зазначеного параметра в скобці, варіанти:
                      :nth-child(odd) – вибирає непарні дочірні елементи.
                      :nth-child(even) – вибирає парні дочірні елементи.
                      :nth-child(3n) – вибирає кожен третій елемент серед дочірніх.
                      Структурні  псевдокласи  типу.  Дозволяють  вказати  на  конкретний  тип
               дочірнього тегу:
                      :nth-of-type() – вибирає елементи за аналогією з :nth-child(), при
               цьому бере до уваги тільки тип елемента.
                      :first-of-type – дозволяє вибрати перший дочірній елемент.
                      :last-of-type – вибирає останній тег конкретного типу.
                      :nth-last-of-type()  –  вибирає  елемент  заданого  типу  в  списку
               елементів відповідно до зазначеного місцеположенням, починаючи з кінця.
                      :only-of-type  –  вибирає  єдиний  елемент  зазначеного  типу  серед
               дочірніх елементів батьківського елементу.
                      –  Псевдоелементи.  Псевдоелементи  використовуються  для  додавання
               вмісту,  який  генерується  за  допомогою  властивості  content,  і  для  зміни
               зовнішнього вигляду частині елементу:

                      :before – вставляє згенерований вміст перед елементом.
                      :after – додає згенерований вміст після елемента.
   45   46   47   48   49   50   51   52   53   54   55