Поддерживаются ли в IE9 псевдоэлементы CSS3::before и::after?

В этой таблице совместимости MS написано, что IE9 не поддерживает псевдоэлементы ::before а также ::after, но когда я пытаюсь, кажется, что это делает... см. JSBin

Я делаю что-то неправильно? я думал ::before а также ::after было бы неплохо, чтобы скрыть вещи от IE9, хотя на самом деле это не так.

Источник

3 ответа

Решение

CSS2 псевдоэлементы :before а также :after, с традиционной нотацией с двоеточием, поддерживаются IE8 и более поздними версиями. Они не новы для CSS3.

Нотация с двоеточием, с другой стороны, является новой для CSS3. IE9 поддерживает эту новую запись для ::before а также ::after и аналогично для псевдоэлементов CSS1 ::first-line а также ::first-letter, Однако в дальнейшем ни один новый псевдоэлемент не может использовать синтаксис с одиночной двоеточием, и ожидается, что браузеры (включая IE) будут поддерживать синтаксис с двойной двоеточием для всех псевдоэлементов.

Я понятия не имею, почему в этой таблице написано, что IE9 не поддерживает новый синтаксис псевдоэлемента, потому что он, безусловно, работает в соответствии с документами для отдельных селекторов, указанных выше, и вашим тестовым примером. Как и, конечно, этот ответ.

Источник

IE 9 поддерживает нотации ::after а также ::before (с двумя двоеточиями) в "стандартном режиме". В "режиме причуд" это не так. Это можно проверить, например, следующим образом:

<style>
p::after  {  
  content: "***AFTER***";  
} 
</style>
<p>Hello world

Здесь правило CSS игнорируется, потому что IE 9 переходит в режим причуд. Но если вы добавите следующую строку в самом начале, IE 9 перейдет в режим стандартов и правило CSS вступит в силу:

<!doctype html>

В IE 9 часто встречаются новые функции CSS (большинство функций, которых нет ни в CSS 2.1, ни в устаревшей версии IE), не поддерживаются. В режиме причуд IE 9 не поддерживает старые нотации с двоеточием :after а также :before или. Он поддерживает их (но не версии с двумя двоеточиями) в "режиме IE 8", который можно выбрать вручную в инструментах разработчика (F12), в меню "режим документа" или на уровне документа с помощью тега. <meta http-equiv="X-UA-Compatible" content="IE=8">,

Источник

Как цитируется http://www.w3.org/community/webed/wiki/Advanced_CSS_selectors

Синтаксис двойных двоеточий в псевдоэлементе CSS3 Обратите внимание, что новый способ написания псевдоэлементов в CSS3 заключается в использовании двойного двоеточия, например,::after { ... }, чтобы отделить их от псевдоклассов. Вы можете увидеть это иногда в CSS. Однако CSS3 также по-прежнему допускает использование псевдоэлементов в виде двоеточия для обратной совместимости, и мы советуем вам пока придерживаться этого синтаксиса.

Источник
Другие вопросы по тегам