Оформление веб-страницы с помощью CSS

HTML задаёт структуру страницы, а CSS (Cascading Style Sheets) определяет её внешний вид: цвет, шрифт, размер, отступы. Разделять структуру и оформление удобно: с помощью одного файла CSS можно сразу изменить дизайн всего сайта.

Правило CSS состоит из селектора и пар свойство: значение; в фигурных скобках. Селектор указывает, к какому элементу относится правило: например, h1 — все заголовки первого уровня, .red — элементы с class="red". Чаще всего используют свойства color (цвет текста), background-color (фон), font-size (размер шрифта), text-align (выравнивание), margin и padding (внешний и внутренний отступы).

Правила можно записать в теге <style> внутри <head>: ``html <style> h1 { color: darkblue; text-align: center; } p { font-size: 18px; } .red { color: red; } </style> ` Затем нужному элементу задают класс: <p class="red">Важно!</p>. В больших проектах CSS выносят в отдельный файл .css и подключают через <link rel="stylesheet" href="style.css">`.

Главное

• HTML отвечает за структуру, CSS — за внешний вид.
• Правило CSS: селектор { свойство: значение; }.
• Класс (class) позволяет задать один стиль нескольким элементам.
• CSS можно вынести в отдельный файл и подключить ко многим страницам.