Новый синтаксис background в CSS

На протяжении нескольких месяцев в Twitter проскакивает информация о новом синтаксисе для CSS – который позволяет более наглядно задавать цвет фона элемента. Напомню, для фона элемента мы применяли background или background-color, и указывали цвет и иногда — альфа канал для прозрачности.

Синтаксис был следующим:

Старый синтаксис

В новом синтаксисе предлагают применять вместо запятых — пробелы, а прозрачность отделять слешем и указывать не дробью ( как раньше), а в процентах.

Новый синтаксис

Поддержка браузерами такого синтаксиса — довольно хорошая, как всегда в аутсайдерах IE 11 и Opera Mobile.

Попробовать новый синтаксис в живую можно ниже, обратите внимание, что и JavaScript тоже позволяет использовать написание через пробел. Кстати, удивляться здесь особо нечему — поскольку JS просто присваивает строку стиля, а дальше дело опять же за браузером.

See the Pen New background by Alex (@Asmodey) on CodePen.

Итого

  • неплохая поддержка браузерами
  • если нужен IE 11 то используйте PostCSS
  • не нравится новый синтаксис — не используйте
  • никто не обяжет вас использовать новый формат здесь и сейчас, думаю переход будет постепенный, вначале переключатся браузеры и станут отображать цвет в новом формате, а потом и мы привыкнем

Посмотреть поддержку браузерами можно здесь.

Использованы материалы: Adam Argyle @argyleink.

Еще статьи

Следи за новостями курсов на нашем канале

Открыть

Правила оформления домашних заданий

Открыть

Форум по задачам

Forum