Псевдоклассы. Страница 5.

Произношение ключевых слов CSS на английском.

Голосовое произношение на английском языке названий псевдоклассов каскадных таблиц стилей. Страница 5.

  • indeterminate
  • - [ˌɪndɪˈtəːmɪnət] -
  • неопределенный

:indeterminate псевдокласс, находит элементы в в неопределенном состоянии. - Пример: input:indeterminate { background: lime; }

  • fullscreen
  • - [fʊlskriːn] -
  • полноэкранный

:fullscreen псевдокласс, применяется к элементам, когда браузер находится в полноэкранном режиме. - Пример: #fs-toggle:fullscreen { background-color: #faa; }

  • target
  • - [ˈtɑːɡɪt] -
  • цель

Другие варианты перевода: мишень, нацеливать

:target псевдокласс, применяется к целевому элементу, который указан в адресной строке браузера.

  • empty
  • - [ˈɛm(p)ti] -
  • пустой

:empty псевдокласс, находит пустые элементы, такие, которые не содержат дочерних элементов, текста, пробелов или переносов строк. - Пример: span:empty {background: red; padding: 3px; display: inline-block;} /* Найдет в html соде все путые парные теги span и присвоит им указанные стили */

  • blank
  • - [blaŋk] -
  • пустой

:blank псевдокласс, находит элементы, у которых либо вообще нет дочерних узлов, либо только пустые текстовые узлы, либо только текстовые узлы, содержащие только пробельные символы. По своему действию похож на :empty, но :blank, в отличие от него, считает пустыми элементы, содержащие пробел или перенос строк. Пример: span:blank {background: red; padding: 3px; display: inline-block;} /* Рабочий проект, браузерами не поддерживается */

  • focus
  • - [ˈfəʊkəs] -
  • фокус

:focus псевдокласс, определяет стиль для элемента, получающего фокус. - Пример: .form:focus { border: 1px solid #29B0D9; }

  • focus-within
  • - [ˈfəʊkəs wɪðˈɪn] -
  • фокус в пределах

:focus-within псевдокласс, определяет стиль элемента, когда он сам или элементы внутри него получают фокус. В отличие от :focus, который применяется непосредственно к самому элементу, :focus-within работает для родителя. - Пример: div:focus-within { background: #DEF0E7; }

  • lang
  • - [læŋ] -
  • языки

Другие варианты перевода: сокращение яз., от слова языки; в качестве наречия - давным-давно

:lang псевдокласс, определяет язык, который используется в документе или его фрагменте, с его помощью можно задавать определённые настройки, характерные для разных языков - Пример: q:lang(en) { quotes: "201C" "201D"; } /* Вид кавычек для английского языка */

  • not
  • - [nɒt] -
  • не

Другие варианты перевода: нет, ни

:not псевдокласс, задаёт правила стилей для элементов, которые не содержат указанный селектор. В качестве селектора могут указываться теги, идентификаторы, классы и селекторы атрибутов.- Пример: input:not([type="submit"]) { border: 1px solid #ccc; }

  • nth
  • - [ˈenθ] -
  • энный

nth употребляется:
1. для описания последних в длинном ряду вещей, предметов и т.п., когда вы не знаете их точное колличество;
2. в качестве приставки у псевдо-классов в CSS которые используется для добавления стиля к элементам на основе нумерации в дереве элементов.

_____ 57

CSS псевдо-класс :indeterminate находит элементы в неопределённом состоянии. Под это определение попадают следующие элементы:

  1. Элементы input type="checkbox", свойство indeterminate которых было установлено в true через JavaScript;
  2. Элементы input type="radio", когда все радио переключатели в одной группе (с одинаковым атрибутом name) невыбраны;
  3. Элементы progress в неопределённом состоянии.

HTML


<div>
  <input type="checkbox" id="checkbox">
  <label for="checkbox">Эта метка будет зелёной.</label>
</div>
<div>
  <input type="radio" id="radio">
  <label for="radio">Эта метка будет зелёной.</label>
</div>

CSS


input:indeterminate + label {
  background: lime;
}

JavaScript


var inputs = document.getElementsByTagName("input");

for (var i = 0; i < inputs.length; i++) {
  inputs[i].indeterminate = true;
}
_____ 58

Целевой элемент (target item) — Элемент, в котором обнаружена указанная характеристика.

Целевой элемент в HTML, CSS — идентификатор, который указан в адресной строке браузера.

В адресе http://www.example.com/index.html#section2 происходит переход к элементу, атрибут id которого задан как section2. Такая запись адреса называется «целевой элемент». Псевдокласс :target применяется к целевому элементу, иными словами, к идентификатору, который указан в адресной строке браузера. Пример:

CSS


/* Выбирает элемент с подходящим ID текущего URL-фрагмента */
:target 
{
  border: 2px solid black;
}

URL

http://www.example.com/index.html#section2

HTML

Следующий элмент будет выбран селектором :target, если текущий URL равен вышеуказанному: <section id="section2">Example</section>

  1. Страницы:
  2. 1
  3. 2
  4. 3
  5. 4
  6. 5
  7. Смотреть все
Мир: 2200 7704 0666 4963
Яндекс: 41 00 11 25 13 54 962
Киви: ALEKS33550336
  1. Похожие страницы:
  2. Произношение названий тегов HTML.
  3. Атрибуты HTML на английском.
  4. Произношение значений атрибутов.
  5. Слова и фразы на тему HTML.
Оглавление раздела «CSS»
  1. Дескрипторы и атрибуты.
  2. Наследование или сбрасывание значений.
  3. Ключевые слова CSS для создания содержимого.
  4. Псевдоклассы.
  5. Псевдоэлементы.
  6. Название цветов используемых в CSS.
  7. Свойства для изменения цвета и фона.
  8. Раздел «CSS».Главная страница раздела
  9. Тематический аудио-класс.Смотреть все