¿Hay alguna diferencia funcional entre el CSS 2.1 :aftery los ::afterpseudo-selectores CSS 3 (aparte de que ::afterno es compatible con navegadores antiguos)? ¿Hay alguna razón práctica para usar la nueva especificación?
¿Hay alguna diferencia funcional entre el CSS 2.1 :aftery los ::afterpseudo-selectores CSS 3 (aparte de que ::afterno es compatible con navegadores antiguos)? ¿Hay alguna razón práctica para usar la nueva especificación?
Respuestas:
Es pseudo- clase vs pseudo- elemento de distinción.
A excepción de ::first-line, ::first-letter, ::beforey ::after(que han sido alrededor de un poco de tiempo y se puede utilizar con dos puntos individuales si necesita ayuda IE8), pseudo- elementos requieren dos puntos dobles.
Las pseudo-clases seleccionan elementos reales por sí mismos, puede usar :first-childo :nth-of-type(n)para seleccionar los primeros o específicos <p>en un div, por ejemplo.
(Y también estados de elementos reales como :hovery :focus.)
Los seudoelementos se dirigen a una subparte de un elemento como ::first-lineo ::first-letter, cosas que no son elementos por derecho propio.
En realidad, mejor descripción aquí: http://bricss.net/post/10768584657/know-your-lingo-pseudo-class-vs-pseudo-element
También aquí: http://www.evotech.net/blog/2007/ 05 / after-v-after-what-is-double-colon-notation /
:aftery ::afterde manera intercambiable con un comportamiento idéntico con la excepción de Internet Explorer 8 que, como las notas de interrogación, requiere la única colon.
Los selectores de CSS ::afterson algunos elementos virtuales que no están disponibles como elemento explícito en el árbol DOM. Se denominan " pseudo-elementos " y se utilizan para insertar algún contenido antes / después de un elemento (por ejemplo ::before, ::after) o seleccionar alguna parte de un elemento (por ejemplo:) ::first-letter. Actualmente hay sólo 5 pseudo elementos estándar: after, before, first-letter, first-line, selection.
Por otro lado, hay otros tipos de selectores llamados " pseudo-clases ", que se utilizan para definir un estado especial de un elemento (como como :hover, :focus, :nth-child(n)). Estos seleccionarán todo un elemento existente en DOM. Las pseudo clases son una larga lista con más de 30 elementos.
Inicialmente (en CSS2 y CSS1), la sintaxis de dos puntos se utilizó para pseudo-clases y pseudo-elementos. Pero, en CSS3, la ::sintaxis reemplazó la :notación de pseudoelementos para distinguirlos mejor.
Por compatibilidad con versiones anteriores, la antigua sintaxis de dos puntos es aceptable para pseudoelementos como as :after(los navegadores todavía admiten la sintaxis anterior con un punto y coma). Solo IE-8 no admite la nueva sintaxis (use dos puntos si desea admitir IE8).