• Авторизация


Прелести CSS 3: псевдо-класс :not() 05-11-2008 15:33 к комментариям - к полной версии - понравилось!


Оригинал сообщения

Комментарии: [показать]

С момента публикации спецификации СSS 3 прошло почти 3 года, но вебмастера так и не могут воспользоваться всеми преимуществами нового стандарта. Перетирать причины и искать виновников - дело бесполезное т.к. все равно ничего с места не сдвинется. Можно лишь сказать спасибо разработчикам FireFox и Safari, за возможность “пощупать” новые свойства CSS 3.

Мне хочется рассказать об одном из таких замечательных нововведений  CSS 3, а именно: о псевдо-классе :not(). В спецификации нем написано всего пару строк, но польза его очень велика.
The negation pseudo-class, :not(X), is a functional notation taking a simple selector […] as an argument. It represents an element that is not represented by the argument.

Здесь говориться о том, что псевдо-класс :not() использует в качестве аргумента селектор, тем самым исключая его из набора тех селекторов, к которым необходимо прописать стили.
Как защитить свой сайт от мошенников? Актуальная статья о протоколах безопасной передачи данных в Интернет.

Рок за свободу: концерт, посвященный событиям августа 1991 года. Чувства, о которых можно рассказать только музыкой.

Нужна квартира в кредит? Выясните все вопросы об ипотеке и условиях кредита на жилье.

А вы когда-нибудь пробовали настоящую итальянскую пиццу? Все рецепты итальянской кухни теперь на сайте www.italian-kitchen.org.

Настоящая баня с березовым веником… Лучший отдых от насущных проблем и забот.



Например, в качестве аргумента могут быть селекторы:
div
*
[value="somevalue"]
.someclass
#someid
:hover

Примеры использования


div:not(.home) {…}

Данная запись означает, что свойства записанные в фигурных скобках, будут применены ко всем элементам div, кроме элемента, имеющего класс .home. К сожалению, в качестве аргументов not(), использовать потомки селекторов нельзя.

Используя приведенный ниже код, можно написать стили для всех элементов p в блоке div, кроме первого, т.е. кроме первого абзаца текста.
div:not(p::first-line) {…}

И так далее.. Примеров можно привести множество, а вот увидеть их в действии можно только в браузерах Opera, Safari и FireFox.

IE такие высоты пока не покорил и очень жаль, т.к. этот псевдо-класс решил бы множество задач в процессе верстки..

[показать]LIci WP - WordPress crossposting plugin
вверх^ к полной версии понравилось! в evernote
Комментарии (1):
chapel 08-12-2008-21:28 удалить
действительно полезный псевдокласс. проще исключить один, чем для каждого кроме одного задаввать класс


Комментарии (1): вверх^

Вы сейчас не можете прокомментировать это сообщение.

Дневник Прелести CSS 3: псевдо-класс :not() | getincss - Дневник getincss | Лента друзей getincss / Полная версия Добавить в друзья Страницы: раньше»