В предыдущей статье Создаем границу у сайта мы активно использовали псевдо-элементы. А поддерживаются ли псевдо-элементы браузерами? Этот вопрос тревожит многих веб-разработчиков. На данный момент псевдо-элементы :before и :after поддерживаются достаточно неплохо, в отличие от многих интересных фишек CSS3.
Исследование основывается на экспериментах со специальной демо-страницей. Вы можете сами просмотреть ее в разных браузерах. Так же, по старым браузерам, была просмотрена документация. Все это сравнивалось с информацией, которую дал сервис BrowserShots. В итоге получилась достаточно простая и понятная табличка.
![]() |
Все версии | Полная поддержка |
![]() |
Версия 6 и выше | Полная поддержка |
![]() |
Версия 1.3 и выше | Полная поддержка |
![]() |
Версия 3.5 и выше | Полная поддержка |
Версия 3.0 и ниже | Частичная поддержка | |
![]() |
Версия 9 и выше | Полная поддержка |
Версия 8 | Частичная поддержка | |
Версия 7 и ниже | Нет поддержки |
P.S.: кому пригодятся большие иконки браузеров — картинки кликабельны — пользуйтесь.
до/после гуд
html:after
html:before
Хром не тянет….
странно — должен поддерживать. я тоже на хроме — все прекрасно работает