¿Cuál es la forma correcta de especificar un estado hover/focus/visited en un enlace que tiene una clase?Forma correcta de hacer Hover/Focus/Visited en enlaces con una clase?
a:focus.class{}
o
a.class:focus{}
Ambos parecen funcionar, simplemente se preguntó lo que se considera la forma correcta .
Ambos son correctos ya que la pseudo-clase puede aparecer en cualquier lugar allí.
pseudo-clases se permiten en cualquier lugar de selectores mientras pseudo-elementos solamente pueden ser añadidos después de la última selector simple del selector.
Personalmente, prefiero el segundo, principalmente para la legibilidad, y puede cambiar a medida que avanza, p. :hover, entonces prefiero tener todo lo estático y luego dinámico, no una mezcla ... simplemente tiene más sentido, supongo.
El único ejemplo de esto que pude encontrar en la spec fue la siguiente:
a.external:visited { color: blue }
Al igual que Nick, yo prefiero esta manera.
Creo que para legibilidad utilizaría el segundo. Declarar primero la pseudo clase podría perderse fácilmente durante el mantenimiento.
Ambos son bien según la CSS2.1 spec:
Un selector simple es o bien un selector tipo o selector universal, seguido inmediatamente por cero o más selectores de atributos, selectores de ID, o pseudo-clases, en cualquier orden.
Un pseudo-elemento (: después,: antes) sólo se permite en el extremo sin embargo,
pseudo-clases se permiten en cualquier lugar de selectores mientras pseudo-elementos solamente pueden ser añadidos después de la última selector simple del selector.
Personalmente, yo también mantendría las pseudo-clases al final, ya que creo que mejora la legibilidad.
personnaly uso el segundo, aquí es cómo veo esto:
Debe pensar que con la semántica, que dirían
"Cuando < a> de la clase clase <> activan la evento < hover> Quiero < que> suceda."
no esto:
" Cuando un <> evento de disparo < vuelo estacionario> comprobar si se trata de la clase de la clase <> luego hacer que <>"