Использование свойств CSS

Свойства CSS — это параметры, которые контролируют внешний вид элементов веб-страниц, включая цвета, фоны, анимации и другие характеристики.

Общие принципы

Каждая запись свойства имеет формат:

css

property: value;

Пример:

css

color: red;

Правила объединяются внутри фигурных скобок с селектором:

css

селектор { свойство: значение; }

Примеры набора правил

Можно комбинировать несколько свойств:

css

селектор1, селектор2, селектор3 { свойство1: значение1; свойство2: значение2; свойство3: значение3; }

Пример применения:

css

.мой-стиль { color: turquoise; padding: 20px; }

Селекторы CSS

Селекторы определяют, к каким элементам применяются стили.

Пример для тега <div>:

css

div { background-color: turquoise; text-align: center; }

Единицы измерения

Абсолютные величины

px (пиксели)

pt (пункты)

cm (сантиметры)

mm (миллиметры)

Относительные величины

% (проценты)

em (относительно размера шрифта)

rem (относительно размера корневого элемента)

vw, vh (относительно окна браузера)

Функции CSS

Специальные функции для динамических значений:

calc() — математические вычисления

var() — использование переменных

url() — загрузка ресурсов

rgba() — цвета с прозрачностью

Значения по умолчанию

Многие свойства имеют значения по умолчанию, например:

color: black

font-size: medium

margin: 0

padding: 0

Эти значения могут различаться в зависимости от браузера и типа элемента.