Статьи

Регулярные селекторы атрибутов

Их не существует, но разве это не так круто? Я понятия не имею, насколько сложно это реализовать или как дорого разобрать, но разве это не просто бомба?

Допустим, у меня есть несколько элементов со схожими именами классов, которые имеют общий стиль, но также нуждаются в отдельных правилах, например:

<ul id="menu"> <li id="menu-home"><a href="/">Home</a></li> <li id="menu-products"><a href="/products/">Products</a></li> <li id="menu-about"><a href="/about/">About</a></li> </ul> 

Я мог бы сделать замену изображения в этих элементах списка, чтобы создать графическую панель навигации с правилами, подобными этим:

 #menu li { background:none #fff no-repeat; } #menu li#menu-home { background-image:url("home.png"); } #menu li#menu-products { background-image:url("products.png"); } #menu li#menu-about { background-image:url("about.png"); } 

Не так уж плохо, но по мере того, как структура увеличивается в размерах, растет и CSS . Если структура станет очень большой, CSS станет одинаково многословным; не говоря уже о том, что мне приходится вручную редактировать его каждый раз, когда добавляется новый элемент.

Но что, если бы я мог просто сделать это:

 #menu li[id%="/^menu-([az]+)$/"] { background-image:url("$1.png"); } 

Теперь мои стили меню бесконечно расширяемы — я могу добавлять любое количество новых элементов, даже не касаясь CSS !

Просто мысль…