Как вообще работает селектор *?

Question

[corrector25]

До регулирования у цвета прозрачности селектор * воспринимался просто как тот селектор, который задает параметры для всей страницы. Но окей, почему тогда получается вот такая ерунда? Почему вся страница не приобретает просто тот цвет, который был задан?
Пример по ссылке:
https://codepen.io/Eva255/pen/mdVJage

Comments

[Дмитрий]

потому что происходит наложение цвета .5 + .5

[corrector25]

Дмитрий, тут же не были заданы параметры отдельно для p и h1. Откуда два раза по 0.5? Что на что накладывается?

[Дмитрий]

corrector25, Этот селектор называется универсальным. Более подробно

[archelon]

не для всей страницы, а для каждого элемента.

тут же не были заданы параметры отдельно для p и h1

именно, что были.

[corrector25]

archelon, теперь понятно) спасибо

Answer 1

[Арсений Матыцин]

Это селектор, который выбирает КАЖДЫЙ ДОЧЕРНИЙ ЭЛЕМЕНТ. Каждый. Прямо совсем каждый. Дочерний.

Т.е. можно писать p *{ и тогда все, что ты вложишь в тег P будет описываться этим свойством с учетом специфичности.

Чтобы залить страницу фоном, вешай стили на body, а еще лучше на div, который будет описывать все тело страницы.

ЗЫ: указывать body в codepen не имеет смысла, так как во вьюхе ты получаешь документ, который уже содержит базовую разметку.

Comments

[corrector25]

Понятно) а разве body не обращается ТОЖЕ к каждому элементу, который находится в этом тэге?

[Арсений Матыцин]

corrector25, нет, когда ты пишешь в селекторе тег, ты обращаешься только к тегу. Body не исключение.

https://developer.mozilla.org/ru/docs/Web/CSS/CSS_...