Урок 6. Первый CSS: красим страницу

CSS — это правила оформления. Одно правило выглядит так:

h1 {
  color: red;
}

Читается это буквально: «всем заголовкам h1 задать цвет текста красный». Здесь три части:

• селектор h1 — кого красим;
• свойство color — что именно меняем;
• значение red — на что меняем.

После свойства — двоеточие, после значения — точка с запятой. Забыл точку с запятой — браузер не поймёт, где кончилось одно правило и началось другое, и просто пропустит их.

Два главных свойства

• color — цвет текста;
• background — цвет фона.

Как называть цвета

Тремя способами. Словом — red, blue, gold, tomato (таких слов около 140). Кодом — #23e0ff, где после решётки шесть символов: сколько красного, зелёного и синего. И через rgb(35, 224, 255) — то же самое, но цифрами от 0 до 255.

Где живёт CSS

В отдельном файле style.css. В HTML он подключается одной строкой в <head> — вкладка с файлом стилей уже открыта в редакторе слева, переключайся между ними.

<link rel="stylesheet" href="style.css">

Частые вопросы