Esiste qualche differenza funzionale tra i CSS 2.1 e gli pseudo-selettori CSS 3 ::after
(diversi da ::after
non supportati nei browser precedenti)? C'è qualche ragione pratica per usare le nuove specifiche?: after vs. :: after
risposta
E 'pseudo-classe vs pseudo elemento distinzione.
Fatta eccezione per ::first-line
, ::first-letter
, ::before
e ::after
(che sono stati in giro un po 'di tempo e può essere utilizzato con i singoli i due punti se si richiede il supporto IE8), Pseudo-elementirichiedono doppi due punti.
pseudo-classi selezionare elementi veri e propri, è possibile utilizzare :first-child
o :nth-of-type(n)
per selezionare i primi o specifici s <p>
' in un div, per esempio.
(e stati anche degli elementi reali come :hover
e :focus
.)
pseudo-elementi rivolgono un sub-parte di un elemento come ::first-line
o ::first-letter
, cose che non sono elementi a sé stanti.
In realtà, una migliore descrizione qui: http://bricss.net/post/10768584657/know-your-lingo-pseudo-class-vs-pseudo-element
Anche qui: http://www.evotech.net/blog/2007/05/after-v-after-what-is-double-colon-notation/
selettori CSS come ::after
sono alcuni elementi virtuali non disponibile come elemento esplicito nel DOM albero. Essi sono chiamati "Pseudo-Elements" e vengono utilizzati per inserto alcuni contenuti prima/dopo un elemento (es: ::before
, ::after
) oppure, seleziona una parte di un elemento (es: ::first-letter
). Attualmente ci sono solo 5 pseudo elementi standard: after, before, first-letter, first-line, selection
.
D'altra parte, ci sono altri tipi di selettori chiamati "Pseudo-Classes" che vengono utilizzati per definire un speciale stato di un elemento (come come :hover
, :focus
, :nth-child(n)
). Questi selezioneranno l'intero elemento esistente in DOM. Le pseudo classi sono una lunga lista con più di 30 articoli.
Inizialmente (nei CSS2 e CSS1), la sintassi dei singoli punti veniva utilizzata sia per le pseudo-classi che per gli pseudo-elementi. Tuttavia, nei CSS3 la sintassi ::
sostituiva la notazione :
per gli pseudo-elementi per distinguerli meglio.
Per compatibilità con le versioni precedenti, la sintassi del singolo punto e virgola è accettabile per gli pseudo-elementi come (i browser supportano ancora la vecchia sintassi con un punto e virgola). Solo IE-8 non supporta la nuova sintassi (usa i due punti se si desidera supportare IE8).
È a causa di questa distinzione che "pseudo-selettore" (dalla domanda) è un termine senza senso. Non usarlo, mai. – BoltClock
a meno che non si parli di entrambi. o in termini generici. – albert
Questa è una grande spiegazione della teoria, ma ha un impatto sul problema pratico? C'è davvero qualche vantaggio nell'usare la specifica css3, dato che il css2 avrà lo stesso lavoro fatto - in più browser? – DRosenfeld