Есть ли функциональное различие между CSS 2.1 и псевдоселекторами CSS 3 ::after
(кроме ::after
, которые не поддерживаются в старых браузерах)? Есть ли практическая причина использовать новую спецификацию?: after vs. :: after
ответ
Это псевдо-класс vs pseudo- элемент различие.
для ::first-line
, ::first-letter
, ::before
и ::after
(которые были вокруг некоторого времени, и может быть использован с одиночными двоеточием, если вам необходима поддержка IE8) За исключением случаев, псевдоевклидовы элементовтребуют двойного двоеточия.
Псевдоклассы выбрать фактические элементы сами, вы можете использовать :first-child
или :nth-of-type(n)
для выбора первого или конкретных <p>
«S в DIV, например.
(а также состояния реальных элементов, таких как :hover
и :focus
.)
Псевдоэлементы целевой вложенную часть элемента, как ::first-line
или ::first-letter
, вещи, которые не являются элементами в их собственном праве.
На самом деле, лучше описание здесь: http://bricss.net/post/10768584657/know-your-lingo-pseudo-class-vs-pseudo-element
Также здесь: http://www.evotech.net/blog/2007/05/after-v-after-what-is-double-colon-notation/
CSS селекторы как ::after
некоторые виртуальные элементы не доступны в качестве явного элемента в DOM дереве. Их называют «Pseudo-Elements» и используются для вставки некоторое содержимое перед/после элемента (например: ::before
, ::after
) или выберите какую-то часть элемента (например: ::first-letter
). В настоящее время существует только 5 стандартных псевдоэлементов: after, before, first-letter, first-line, selection
.
С другой стороны, существует и другие типов селекторов называемых «Pseudo-Classes», которые используются для определения особого состояния элемента (например, как :hover
, :focus
, :nth-child(n)
). Они выберут весь существующий элемент в DOM. Псевдо классы - это длинный список с более чем 30 элементами.
Изначально (в CSS2 и CSS1) синтаксис с одной колонкой использовался как для псевдоклассов, так и для псевдоэлементов. Но в CSS3 синтаксис ::
заменил нотацию для псевдоэлементов :
, чтобы лучше различать их.
Для обратной совместимости старый синтаксис с одной колонкой допустим для псевдоэлементов, таких как :after
(браузеры все еще поддерживают старый синтаксис с точкой с запятой). Только IE-8 не поддерживает новый синтаксис (используйте single-colon, если вы хотите поддерживать IE8).
- 1. Использование оператора after after if
- 2. Hibernate - setProjection after Criteria after Criteria
- 3. MySQL After Insert и After Update Trigger
- 4. eval-after-load vs. mode hook
- 5. append vs after jquery (ошибка разрыва страницы)
- 6. fadein after 2s, затем fadeout after 10s animation
- 7. Изменение продолжительности слоя в композиции на javascript in after after
- 8. Reindexing after pandas.drop_duplicates
- 9. Confuse after quickstart
- 10. {NSLocalizedDescription = Garbage after JSON}
- 11. Combobox store after render
- 12. Trigger after update orderline
- 13. return after Dispatcher.invoke метод
- 14. jQuery.click() call after onClick
- 15. window.opener lost after redirect
- 16. String after split
- 17. OpenMember After CloseMember
- 18. PHP pagination after concatonation
- 19. javascript callback after loop
- 20. WebService Call after timeInterval
- 21. Asterisk IVR After Hangup
- 22. sphinx performance after idle
- 23. checkboxes empty after saving
- 24. Redirect After Click Anywhere
- 25. JQuery .after() IE проблема
- 26. Autoscrolling after timeout
- 27. Broken sort after search
- 28. Hook crashing after trampoline
- 29. MySQL delete after timeout
- 30. Android error after finish()
Именно из-за этого различия, что «псевдоселектор» (из вопроса) является бессмысленным термином. Не используйте его, когда-либо. – BoltClock
, если вы не говорите о них обоих. или в общих терминах. – albert
Это отличное объяснение теории, но имеет ли она отношение к практической проблеме? Есть ли какая-либо польза от использования спецификации css3, заключающейся в том, что css2 выполнит ту же работу - в более браузерах? – DRosenfeld