Глава 1 · Урок 2 из 6
История и модули CSS
Как появился CSS: предложение Хокона Виума Ли, CSS1 и CSS2, почему не будет CSS4, как устроены модули и уровни спецификаций и что такое Baseline.
Цель урока
Узнать, откуда взялся CSS, почему сегодня он развивается модулями, и научиться понимать, насколько новая возможность готова к работе.
Как всё начиналось
Первые веб-страницы оформлять было почти нечем: автор писал разметку, а вид задавал браузер. В 1994 году Хокон Виум Ли, работавший тогда в CERN, предложил каскадные таблицы стилей — отдельный язык, в котором и автор, и читатель могут задавать оформление, а их пожелания объединяются по понятным правилам. К работе вскоре присоединился Берт Бос.
В 1996 году W3C — консорциум, который разрабатывает веб-стандарты, — выпустил рекомендацию CSS1: шрифты, цвета, отступы, выравнивание текста. В 1998 году вышел CSS2 с позиционированием, типами носителей (экран, печать) и многим другим. Его доработанная версия CSS 2.1 стала рекомендацией в 2011 году — к тому времени браузеры давно её поддерживали.
Модули вместо версий
CSS2 оказался слишком большим документом: чтобы выпустить его целиком, нужно было дождаться готовности всех частей. Поэтому дальше язык разделили на модули: цвета, селекторы, флексбоксы, сетки, анимации и так далее. Каждый модуль развивается сам по себе и проходит уровни: CSS Color Module Level 4, Selectors Level 4, CSS Grid Layout Module Level 2.
Отсюда путаница с «CSS3». Так называли всё, что появилось после CSS 2.1, но версии CSS3 как единого документа нет. И CSS4 не будет: у разных модулей свои уровни, и уровень 4 одного модуля никак не связан с уровнем 4 другого.
Как рождается возможность
Модуль проходит путь от черновика до рекомендации. Главные этапы:
- Editor’s Draft — рабочий черновик редакторов, меняется постоянно.
- Working Draft — опубликованный черновик рабочей группы.
- Candidate Recommendation — возможность считается готовой, собирают опыт реализации.
- Recommendation — окончательный стандарт.
На практике браузеры реализуют возможности задолго до финального статуса. Многие модули, которыми все пользуются каждый день, формально всё ещё кандидаты в рекомендации. Поэтому статус документа мало что говорит о том, можно ли возможность использовать.
Можно ли уже пользоваться
Полезнее смотреть на поддержку в браузерах. Для этого на каждой странице справочника есть таблица поддержки и статус Baseline:
- Широко доступно — возможность работает во всех основных браузерах не меньше двух с половиной лет. Пользуйтесь смело.
- Недавно доступно — только что заработала во всех основных браузерах. Проверьте, какими версиями пользуется ваша аудитория.
- Ограниченная доступность — работает не везде. Нужен запасной вариант.
Список «основных браузеров» для Baseline — Chrome, Edge, Firefox и Safari на компьютерах и телефонах. Яндекс Браузер построен на Chromium и обычно поддерживает то же, что Chrome.
Что запомнить
- CSS предложил Хокон Виум Ли в 1994 году, первая рекомендация W3C — CSS1, 1996 год.
- После CSS 2.1 язык развивается отдельными модулями со своими уровнями.
- «CSS3» и «CSS4» — не версии языка, а условные названия; единой новой версии не будет.
- Готовность возможности лучше проверять по браузерам и статусу Baseline, а не по статусу спецификации.
Проверьте себя
Практика
Задача 1
Проверьте поддержку свойства
Откройте страницу свойства gap в справочнике и найдите раздел «Поддержка браузерами». С какой версии Safari gap работает во флекс-контейнерах? Какой у свойства статус Baseline?
Показать решение
В таблице поддержки строка «Во флекс-контейнере» показывает версию Safari 14.1. Статус свойства — «Baseline: широко доступно».