Будущее CSS 4
Прежде всего, не стоит потирать свои ручки — CSS 4 это всего лишь черновик, всего лишь наброски. И внедрится в веб он еще не скоро. Хотя, благодаря гонке браузеров, кто знает, кто знает... CSS 3 также не является на сегодняшний день законченным стандартом, однако все современные браузеры в той или иной степени поддерживают эти спецификации. Так чего же ждать в будущем от CSS 4?
Селекторы родителей
Эта возможность была бы кстати уже давно. Иногда, при верстке сложных макетов, возникает необходимость применить стиль к предку. Например, вам нужно выделить блок, внутри которого есть класс .hot:
$section a.hot {
border: 1px solid red;
}
Псевдоклассы ссылок
Довольно часто на сайтах выделяют внешние ссылки и в CSS 4 решили добавить эту возможность. Например, ссылки внутри вашего домена можно оформить так:
a:local-link {
color: blue;
}
А все ссылки, ведущие на другие сайты, так:
a:any-link {
background: url(other.png) no-repeat;
}
Или так:
:not(:local-link) {
background: url(other.png) no-repeat;
}
Здесь использован псевдокласс отрицания из CSS 3, который можно применять только к простым селекторам, но не к их комбинациям (nav .link, ol > li и т. п.). В CSS 4 эти ограничения уже не будут важны.
Лингвистический псевдокласс
Тут все просто, псевдокласс определяет определить стили исходя из направления текста на мониторе. Это важно для сайтов, в которых есть одновременно и индоевропейские языки и, например, арабские:
p:dir(ltr) {
/* Стили для текста слева направо */
}
div:dir(rtl) {
/* Стили для текста справа налево */
}
Псевдокласс группировки
Иногда приходится задавать стили для нескольких псевдоклассов элемента, например:
li a:link, li a:hover, li a:visited, li a:focus {
color: red;
}
В CSS 4 можно будет делать проще:
li a:matches(:link, :hover, :visited) {
color: red;
}
Или пример, когда часто нужно подсвечивать текстовое поле при фокусе его метки:
label:matches(:hover, :focus) /for/ input {
box-shadow: red 0 0 5px;
}
Будет подсвечиваться поле, id которого совпадает с атрибутом for текущей метки.
Это далеко не все «плюшки» новой версии каскадных таблиц. Со своей стороны мы следим за развитием веба и CSS 4 в частности. Как только браузеры станут поддерживать эти спецификации, мы начнем применять возможности CSS 4 на практике. Чего и вам желаем :-)
Ссылки: