Что такое CSS?

Что такое CSS?

Вы изучили HTML и создали простую страницу, но она всё ещё выглядит серой и похожа на газетный текст? Именно в этот момент многие задают один и тот же вопрос: «А где же цвета, шрифты, красивые кнопки?» Ответ — одно слово: CSS. Но и здесь повторяется одно и то же заблуждение: многие думают, что CSS — это просто «выбор цвета» и не имеет никакого отношения к программированию. На самом деле те, кто не понимает силу CSS, никогда не видят настоящих возможностей веб-дизайна в полной мере.

Что такое CSS — и является ли он языком программирования?

Полное название CSS — Cascading Style Sheets, то есть «Каскадные Таблицы Стилей». Обратите внимание: в названии есть слово «язык», но нет слова «программирование». И это не случайно. CSS — это язык стилей — он не даёт команды компьютеру, а просто описывает, как что-то должно выглядеть.

Если HTML говорит «это заголовок», то CSS говорит «пусть этот заголовок будет синим, крупным и по центру». В HTML нет условий, циклов или функций — в CSS их тоже нет. Оба языка не отдают команды, а описывают. Разница лишь в том, что именно они описывают: HTML — структуру, а CSS — внешний вид.

Как выглядит CSS на практике

Этот код просто говорит: «пусть все заголовки h1 будут синими, размером 32 пикселя и выровнены по центру; а все абзацы — тёмно-серого цвета с удобным межстрочным интервалом для чтения». Здесь нет никаких вычислений — только правило. Браузер считывает эти правила и превращает «скелет» HTML в живой дизайн.

HTML, CSS и JavaScript — три разные роли

Если сравнить эту тройку со строительством дома, роль каждого становится понятной:

• HTML — это дом. Комнаты, стены, двери.
• CSS — это интерьер. Цвета, освещение, декор.
• JavaScript — это электричество. Кнопки работают, двери открываются, всё оживает.

Покрасить стены — не значит построить дом, но и дом без цвета — не место, в котором хочется жить.

Без CSS все сайты выглядели бы одинаково: белый фон, чёрный текст, никакого различия. Именно благодаря CSS бренд создаёт свои цвета, свой шрифт, своё «лицо» — разница между розово-фиолетовым логотипом Instagram и строгим синим дизайном банка заключается именно в CSS.

История CSS — от хаоса к порядку

В начале 1990-х годов отдельной системы для дизайна веб-страниц не существовало — разработчики писали цвета и шрифты прямо внутри HTML-кода. Это быстро превращалось в хаос: каждую страницу одного и того же сайта приходилось форматировать по-разному.

CSS был предложен в 1996 году норвежским инженером по имени Хокон Виум Ли (Håkon Wium Lie) — цель была простой: отделить структуру (HTML) от дизайна (CSS), чтобы можно было изменить внешний вид тысяч страниц несколькими строками кода.

Эта идея актуальна и сегодня: изменив один CSS-файл, можно обновить цвет, шрифт и компоновку всего сайта — без необходимости редактировать каждую страницу отдельно.

Так почему же нужно изучать CSS?

Потому что без CSS ни один сайт не выглядит привлекательным для пользователя:

• Хороший дизайн заставляет пользователя проводить больше времени на сайте
• Благодаря адаптивному (responsive) CSS сайт правильно отображается и на телефоне, и на планшете, и на компьютере
• Айдентика бренда (цвета, шрифты, кнопки) формируется именно с помощью CSS
• Для каждого, кто хочет стать frontend-разработчиком, CSS так же важен, как и основа HTML

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

Главный вывод

CSS — не язык программирования, и это не его недостаток, а его суть. Он создан для того, чтобы описывать внешний вид, а не выстраивать логику.

Хотите применить эти знания на практике и получить реальные результаты? Начните обучение на курсе «IT и Компьютерная инженерия» и шаг за шагом приобретайте практические навыки. Подробнее о курсе — перейдите по ссылке: Курс «IT и Компьютерная инженерия».