Открыть сервис

CSS Level 1

CSS Level 1 — это первая официальная спецификация каскадных таблиц стилей (Cascading Style Sheets, CSS), опубликованная Консорциумом Всемирной паутины (W3C) в декабре 1996 года. Она заложила фундаментальные принципы отделения представления веб-документа от его структуры, определив базовый набор свойств для форматирования текста, цвета, отступов, рамок и позиционирования элементов в языке HTML.

История

Предпосылки создания

До появления CSS веб-страницы оформлялись исключительно с помощью атрибутов HTML (например, bgcolor, font, align) или встроенных тегов, таких как <b> и <i>. Такой подход приводил к дублированию кода, усложнял поддержку крупных сайтов и не позволял гибко менять дизайн без редактирования каждого документа. В 1994 году норвежский программист Хокон Виум Ли (Håkon Wium Lie) предложил концепцию каскадных таблиц стилей, которая позволяла задавать правила оформления отдельно от содержимого и комбинировать их из нескольких источников.

Разработка и стандартизация

Работа над спецификацией велась в рамках деятельности W3C, основанного в 1994 году. В 1995 году Хокон Виум Ли и Берт Бос (Bert Bos) представили проект CSS1. После нескольких итераций и обсуждений, 17 декабря 1996 года W3C опубликовал рекомендацию «Cascading Style Sheets, level 1». Этот документ стал первым стандартом в семействе CSS.

Поддержка браузерами

Первым браузером, реализовавшим поддержку CSS1, стал Internet Explorer 3.0, выпущенный в августе 1996 года (ещё до официальной публикации стандарта). Однако его реализация была неполной и содержала ошибки. Более полная поддержка появилась в Internet Explorer 4.0 (1997) и Netscape Navigator 4.0 (1997), хотя последний также имел существенные проблемы с интерпретацией. Полноценная и корректная поддержка большинства возможностей CSS1 была достигнута только в браузерах пятого поколения (Internet Explorer 5.0 для Mac, Netscape 6.0) в начале 2000-х годов.

Основные возможности

CSS Level 1 определял свойства для управления визуальным представлением элементов HTML. Ключевые области включали:

Свойства шрифта

  • font-family: задание гарнитуры шрифта (например, Arial, Times New Roman) или общего семейства (serif, sans-serif, monospace).
  • font-style: определение начертания (normal, italic, oblique).
  • font-variant: установка капители (small-caps).
  • font-weight: насыщенность (normal, bold, bolder, lighter, числовые значения от 100 до 900).
  • font-size: размер шрифта (в пикселях, пунктах, процентах, ключевых словах типа medium, large).

Свойства текста

  • color: цвет текста.
  • background-color: цвет фона элемента.
  • background-image: фоновое изображение.
  • text-decoration: подчёркивание (underline), надчёркивание (overline), перечёркивание (line-through), мигание (blink — ныне устаревшее).
  • text-align: выравнивание текста по горизонтали (left, right, center, justify).
  • text-indent: отступ первой строки абзаца.
  • line-height: межстрочный интервал.
  • word-spacing и letter-spacing: межсловный и межбуквенный интервалы.
  • vertical-align: вертикальное выравнивание (baseline, sub, super, top, middle, bottom).

Свойства блоков и рамок

  • margin: внешние отступы (все четыре стороны или каждая по отдельности: margin-top, margin-right, margin-bottom, margin-left).
  • padding: внутренние отступы (аналогично margin).
  • border: рамка вокруг элемента (толщина, стиль — solid, dotted, dashed, double, groove, ridge, inset, outset, none; цвет).
  • width и height: ширина и высота элемента (для блочных элементов).
  • float: обтекание элемента текстом (left, right, none).
  • clear: запрет обтекания с указанной стороны.

Селекторы

CSS1 поддерживал следующие способы выбора элементов для применения стилей:

  • Селекторы элементов (типов): p, h1, div.
  • Селекторы классов: .classname.
  • Селекторы идентификаторов: #idname.
  • Контекстные (дочерние) селекторы: p em (все em внутри p).
  • Псевдоклассы: :link, :visited, :active (для ссылок).
  • Псевдоэлементы: :first-letter (первая буква), :first-line (первая строка).

Каскадирование и наследование

Спецификация ввела принцип каскада — механизм разрешения конфликтов между стилями из разных источников (авторские, пользовательские, браузерные) на основе веса (важности) и специфичности селекторов. Также было определено наследование — автоматическое применение некоторых свойств (например, color, font-family) от родительского элемента к дочерним.

Ограничения и критика

CSS Level 1 имел ряд существенных ограничений по сравнению с современными стандартами:

  • Отсутствие управления макетом: не было средств для создания многоколоночных макетов, позиционирования (кроме float), гибких сеток (flexbox) или сеток (grid).
  • Нет поддержки таблиц стилей для разных носителей: хотя концепция упоминалась, полноценные медиа-запросы появились только в CSS3.
  • Ограниченная работа с псевдоклассами: отсутствовали :hover, :focus, :before, :after.
  • Проблемы с кроссбраузерностью: из-за различной реализации стандарта в браузерах веб-разработчикам приходилось использовать хаки и обходные пути.
  • Отсутствие поддержки вложенных правил: все стили описывались линейно, без возможности вложения селекторов.

Значение и наследие

Несмотря на свои ограничения, CSS Level 1 стал революционным шагом в веб-разработке. Он ввёл концепцию разделения содержания и представления, что позволило:

  • Уменьшить объём HTML-кода.
  • Упростить поддержку и обновление дизайна сайтов.
  • Повысить доступность веб-страниц для пользователей с ограниченными возможностями.
  • Создать основу для последующих версий CSS (CSS2, CSS2.1, CSS3), которые расширили его возможности.

CSS Level 1 оставался действующим стандартом до выхода CSS Level 2 в 1998 году, хотя многие его положения были включены в последующие спецификации. Сегодня он представляет исторический интерес, но все его базовые свойства (цвета, шрифты, отступы, рамки) остаются фундаментом современного веб-дизайна.

Источники

  • Cascading Style Sheets, level 1. W3C Recommendation 17 Dec 1996.
  • Lie, Håkon Wium; Bos, Bert. Cascading Style Sheets: Designing for the Web. Addison-Wesley, 1997.
  • Meyer, Eric A. CSS: The Definitive Guide (4th Edition). O'Reilly Media, 2012.
  • Документация Mozilla Developer Network (MDN) — CSS: Cascading Style Sheets.

BFOmetr — база данных и аналитика по компаниям России.

На главную BFOmetr →