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

Схема CSS-кода выглядит следующим образом:

Селектор { CSS-свойство: значение; CSS-свойство: значение; ... и т.д. }

В универсальном селекторе, в качестве селектора, выступает знак звёздочки * :

* { CSS-свойство: значение; CSS-свойство: значение; ... и т.д. }

Универсальный селектор , влияет сразу на все теги HTML-документа.

Например, можно убрать все внутренние и внешние отступы у всех тегов HTML-документа:

* { margin: 0; padding: 0; }

Допустим, у нас есть HTML-документ содержащий следующий код:

Снежный барс

следующим образом .

Давайте с помощью универсального селектора, сделаем цвет шрифта у всех тегов зелёным green , имя шрифта arial , стиль шрифта oblique (наклонный).

Снежный барс

Снежный барс (ирбис, ак барс) - крупное хищное млекопитающее из семейства кошачьих. Обитает в горных массивах Афганистана, Бирмы, Бутана, Индии, Казахстана, Кыргызстана, Китая, Монголии, Непала, Пакистана, России, Таджикистана и Узбекистана. Ирбис отличается тонким, длинным, гибким телом, относительно короткими лапами, небольшой головой и очень длинным хвостом. Длина снежного барса вместе с хвостом составляет 200-230 см, вес до 55 кг. Окраска меха светлая, дымчато-серая с кольцеобразными или сплошными тёмными пятнами.

Охотится снежный барс, в основном, на горных козлов и баранов, также в его рационе встречаются кабаны, фазаны и даже суслики. В силу труднодоступности местообитания вида, ирбисы до сих пор остаются малоизученными. Однако по приблизительным оценкам их количество варьируется в районе около 10 тысяч особей. По состоянию на 2013 год, охота на снежных барсов повсеместно запрещена.

Страница в браузере будет выглядеть следующим образом .

Также можете поэкспериментировать с внешним отступом, сделайте его сначала 0 , а затем 15px , добавьте в CSS-код.

Иногда требуется установить одновременно один стиль для всех элементов веб-страницы, например, задать шрифт или начертание текста. В этом случае поможет универсальный селектор, который соответствует любому элементу веб-страницы.

В CSS3 универсальный селектор применяется также в комбинации с пространством имён.

• ns|* - все элементы в пространстве имён ns .
• *|* - все элементы во всех пространствах имён.
• |* - все элементы без явного указания пространства имён.

Синтаксис

* { Описание правил стиля }

Для обозначения универсального селектора применяется символ звёздочки (*). В некоторых случаях указывать универсальный селектор не обязательно. Так, например, записи *.class и .class являются идентичными по своему результату.

Обозначения

Пример

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.

Примечание

Браузер Internet Explorer до шестой версии включительно понимает конструкцию * html , что нелогично, поскольку тег является тегом верхнего уровня и выше него никаких элементов быть не может. Эта ошибка иногда применяется, чтобы создать стиль для IE6, например конструкция * html body { ... } будет добавлять стиль для селектора body в IE6 и ниже и не работает в других браузерах.

В браузере Internet Explorer 7 при добавлении универсального селектора перед именем селектора без пробелов, он воспринимается как контекстный селектор. Так, запись *body работает только в IE7 и игнорируется другими браузерами.

Спецификация

Каждая спецификация проходит несколько стадий одобрения.

• Recommendation (Рекомендация ) - спецификация одобрена W3C и рекомендована как стандарт.
• Candidate Recommendation (Возможная рекомендация ) - группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
• Proposed Recommendation (Предлагаемая рекомендация ) - на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
• Working Draft (Рабочий проект ) - более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
• Editor"s draft (Редакторский черновик ) - черновая версия стандарта после внесения правок редакторами проекта.
• Draft (Черновик спецификации ) - первая черновая версия стандарта.

• Выполняемая задача — выбор всех элементов. Вообще всех.
• Обозначение — символ «звездочка» — *.
• Пример использования:

для всех элементов сбросить отступы по-умолчанию

Подробнее про универсальный селектор

Появился в CSS с версии 2. Соответствует любому элементу в . Поэтому стили, указанные для универсального селектора применяются ко всем элементам сразу. По этой причине, советую применять его очень осторожно — при наследовании стилей могут быть неприятности. Или, скорее, малопредсказуемое (для неопытного кодера) поведение. Подробнее этот момент рассмотрим в разделе, посвященном наследованию.

Еще одна особенность универсального селектора — когда он используется в сочетании с другим селектором (например, селектором класса, идентификатора или атрибута) в составе простого селектора, то может быть безнаказанно пропущен. Это примерно то же самое, что вместо «Все дромадеры — это одногорбые верблюды» сказать просто «дромадеры — это одногорбые верблюды». Смысл не поменялся.

Пример:

*.error { color: red; } .error { color: red; } /* эти два правила эквивалентны. Универсальный селектор во втором случае пропущен */

Область применения

Собственно, удобнее всего применять универсальный селектор, как в первом примере — для сброса зависящих от браузера начальных значений стилей (в частности, отступов).

Но даже такое применение не всегда окажется удачной идеей. Из-за недостатков универсального селектора, описанных в статье , лучше использовать . То есть использовать селекторы типа.

Вот так плавненько мы с тобой и подошли к следующей теме. С универсальным селектором, вроде, разобрались. Самое время двигаться дальше. Следующая остановка — .

Иногда требуется установить одновременно один стиль для всех элементов веб-страницы, например, задать шрифт или начертание текста. В этом случае поможет универсальный селектор, который соответствует любому элементу веб-страницы.

Для обозначения универсального селектора применяется символ звездочки (*) и в общем случае синтаксис будет следующий.

* { Описание правил стиля }

В некоторых случаях указывать универсальный селектор не обязательно. Так, например, записи *.class и .class являются идентичными по своему результату.

В примере 1.50 показано одно из возможных приложений универсального селектора - выбор шрифта и размера текста для всех элементов документа.