Синтаксис псевдо-элементов :before и :after

Вы, наверное, заметили, как часто в своих уроках я использую эти два псевдо-элемента. Почему они мне нравятся? Потому что их так удобно использовать, что даже не надо добавлять дополнительные HTML элементы. Однако данная статья посвящена не преимуществам псевдо-элементов.

Данная статья посвящена тому, чтобы раз и навсегда разъяснить все непонятки, касающиеся синтаксиса псевдо-элементов.

Псевдо-что?

Псевдо-элементы так называются, потому что они не являются настоящими HTML элементами. Например, в HTML нет тегов before и after, однако в CSS вы можете применить стили к элементам :before и :after.

Одно или два двоеточия?

Нет никакой разницы между :before и ::before или между :after и ::after. Синтаксис с двумя двоеточиями характерен для CSS3.

На http://www.w3.org/TR/css3-selectors/#pseudo-elements есть такой абзац:

Этот знак (::) введен для того, чтобы отличить псевдо-классы от псевдо-элементов. Для совместимости с уже существующими таблицами стилей псевдо-элементы в CSS 1 и 2 также возможно задавать с одним двоеточием (в частности, :first-line, :first-letter, :before и :after).

Резюмируем

IE 7 и более ранние версии не поддерживают перечисленные псевдо-элементы. Но зато IE 8 поддерживает, и это веская (и единственная) причина использовать синтаксис с одним двоеточием.

Важно!

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

Как вы пишите?

Пишите в комментариях о том, какой синтаксис используете именно вы, и из каких соображений.


Источник: http://feedproxy.google.com/~r/ruseller/CdHX/~3/1tCDV7VzcRs/lessons.php

Читать комменты и комментировать

Добавить комментарий / отзыв



Защитный код
Обновить

Синтаксис псевдо-элементов :before и :after | | 2012-06-19 12:05:53 | | Статьи Web-мастеру | | Вы, наверное, заметили, как часто в своих уроках я использую эти два псевдо-элемента. Почему они мне нравятся? Потому что их так удобно использовать, что даже не надо добавлять дополнительные HTML | РэдЛайн, создание сайта, заказать сайт, разработка сайтов, реклама в Интернете, продвижение, маркетинговые исследования, дизайн студия, веб дизайн, раскрутка сайта, создать сайт компании, сделать сайт, создание сайтов, изготовление сайта, обслуживание сайтов, изготовление сайтов, заказать интернет сайт, создать сайт, изготовить сайт, разработка сайта, web студия, создание веб сайта, поддержка сайта, сайт на заказ, сопровождение сайта, дизайн сайта, сайт под ключ, заказ сайта, реклама сайта, хостинг, регистрация доменов, хабаровск, краснодар, москва, комсомольск |
 
Поделиться с друзьями: