Html, css
March 13, 2022

Section и class. Классы и секции

<section> для создания секций и разделов. Ведет себя как див, но сразу сообщает браузеру о своем назначении. Поисковики качественнее сайт прочитают.
<section>
<div></div>
</section>
Нужно для десяти разных <div> свои собственные отличающиеся друг от друга стили? Для этого классы
Классы задают каждому элементу именной ярлык. Так, <div class="white-text"></div> позволит обращаться в стилях к элементу white-text, не затрагивая свойства других div. И этот же класс можно другим элементам задать, например <p>. Для того они в том числе и предназначены.
Например, класс white-text — всем элементам с текстом белого цвета.
<h1 class="white-text">Откуда к нам пришла зима</h1>
<p class="white-text">Не знаешь ты, никто не знает</p>
Текст будет белым, если в стилях прописано правило для класса:
.white-text {
color: #fff;
}
/* в стилях селектор класса начинается с точки */
Так и рекомендуется делать. Стили задавать ДЛЯ КЛАССОВ, А НЕ ДЛЯ ЭЛЕМЕНТОВ. Именовать лучше со смыслом.

Классов может быть несколько. Через пробел делаем. Понятно зачем - чтобы нужному элементу можно было индивидуальным классом что-нибудь присваивать. Отступ, шрифт и т.д.
Использование нескольких классов — это типовой приём, который ещё называется миксованием классов. Обычно его используют так: в один класс выносят общее оформление, а в дополнительных классах описывают его модификации.
И вообще, не надо к селекторам вообще обращаться, это некрасиво и непрофессионально. Даже если где-то скопировал что-то со свойствами например к <header>, то лучше присвоить лишний класс <header class="header">(например) и уже к классу в css обращаться. А не к самому header
В классы удобно простенькие фоновые изображения подкладывать кстати:
.feature-lighting {
padding-top: 65px;
background-image: url("img/lighting.svg");
}