Урок 3: Знакомство с CSS 🎨

Ура, на нашей странице появились цвета и аккуратный шрифт! За это отвечает CSS (Каскадные таблицы стилей). Это наша первая работа над визуалом (UI).

Как работает CSS?

Мы пишем правила дизайна внутри специального тега <style>. Вот как выглядит правило для всей страницы (тега body), которое сейчас работает на этом сайте:

body {
    background-color: #f4f4f9; 
    color: #333333; 
    padding: 20px;
}
    

Что значат эти настройки?

• 🎨 background-color — цвет фона. Мы выбрали светло-серый (#f4f4f9), чтобы глаза не уставали от слишком яркого белого экрана.
• 🎨 color — цвет самого текста. Темно-серый (#333333) читается легче и мягче, чем чисто черный.
• 📐 padding: 20px — это внутренние отступы! Без них этот текст прилип бы вплотную к краям вашего смартфона, и читать его было бы неудобно.