В чем разница между: before и:: before?

Я только что увидел код CSS, который включал тег ::before. Я посмотрел MDN, чтобы узнать, что такое ::before, но я действительно этого не понял. Может кто-нибудь объяснить, как это работает? Он делает элемент DOM до того, что мы выбираем с помощью CSS?

Ответ 1

Это отличает псевдоэлементы от псевдо классов.

Разница между псевдоклассами и псевдоэлементами описана в http://www.d.umn.edu/~lcarlson/csswork/selectors/pseudo_dif.html

Ответ 2

В соответствии с этими документами они эквивалентны:

element:before  { style properties }  /* CSS2 syntax */

element::before { style properties }  /* CSS3 syntax */

Единственное различие заключается в том, что двойной двоеточие используется в CSS3, тогда как единственный двоеточие - это устаревшая версия.

Рассуждение:

В CSS 3 была введена нотация: перед установкой дискриминация между псевдоклассами и псевдоэлементами. Браузеры также принимайте обозначение: перед введением в CSS 2.

Ответ 3

Они, по сути, означают одно и то же. :: был введен в CSS3, чтобы помочь распознать псевдоэлементы (например: before и: after) и псевдоклассы (например: link и: hover).

Ответ 4

Один из них - это метод CSS2 (: before), а другой - CSS3 (:: before). В настоящее время они взаимозаменяемы в браузерах, поддерживающих CSS2 и CSS3.

Вот хорошее объяснение: http://www.impressivewebs.com/before-after-css3/

Ответ 5

Я проверил MDN и w3.org, и самое лучшее, что я мог придумать, заключается в том, что :: используется для структурных изменений, а : используется для стиля.

В настоящее время они взаимозаменяемы по соображениям совместимости.

Кажется, отделяет :link (например), который стиляет a <a>, от :before (что является структурным изменением).

: предназначен для стилизации, :: для структуры.