dr.Brain

doctor Brain

мир глазами веб-разработчика

Когда место не имеет значения

влияет ли последовательность размещения CSS-классов в HTML-документе на свойства элемента

dr.Brain

время чтения 1 мин.

Photo by Brooke Lark on Unsplash

Последовательность размещения CSS-классов элемента в HTML-документе не влияет на его свойства. И это легко доказать.

Для начала, создадим два класса:

.a {
  color: red;
}

.b {
  color: blue;
}

А теперь посмотрим на разметку HTML-документа:

<div class="a b">Текст</div>

Конечно, текст будет синего цвета, ведь это свойство определено классом .b, но что будет если мы объявим классы в другой последовательности:

<div class="b a">Текст</div>

Какого цвета будет текст? Красного или синего?

Это простой и, можно сказать, достаточно глупый вопрос, но он сбивает с толку многих разработчиков, хорошо знакомых с CSS.

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


Спасибо за внимание.

Новые публикации

Далее

Категории

О нас

Frontend & Backend. Статьи, обзоры, заметки, код, уроки.