Selectores explicados

 

 

 

¿Alguna vez te has encontrado escribiendo un selector CSS que termina pareciendo muy confuso, o has visto uno mientras leías el código de alguien? Eso me pasó a mí el otro día.

Esto es lo que escribí:

.site-footer__nav a:hover u003e svg ellipse:first-child { }

Al final, honestamente ni siquiera podía explicar lo que me hace a mí mismo. LOL, eso probablemente significa que había una mejor manera de escribirlo.

Pero Kitty Giraudel tiene esta nueva y útil herramienta que le explicará cualquier selector que le arroje.

Así es como explica el mío:

Un ellipseelemento siempre que sea el primer hijo de su padre en algún lugar
... dentro de un svgelemento
... directamente dentro de un a elemento siempre que esté suspendido
... en algún lugar
... dentro de un elemento con clase site-footer__nav.

 

¡Bravo! Para empezar, incluso escape la especificidad del selector.

Enlace directo →






SUSCRÍBETE A NUESTRO BOLETÍN 

No te pierdas de nuestro contenido ni de ninguna de nuestras guías para que puedas avanzar en los juegos que más te gustan.










Al suscribirte, aceptas nuestra política de privacidad y nuestros términos de servicio.






Tal vez te puede interesar:

  1. La innovación no puede mantener la Web rápida
  2. Rendimiento web ultrarrápido
  3. Tabla de contenidos fijos con estados activos de desplazamiento
  4. “cambiar tamaño: ninguno;” en áreas de texto es una mala experiencia de usuario

Selectores explicados

Selectores explicados

¿Alguna vez te has encontrado escribiendo un selector CSS que termina pareciendo muy confuso, o has visto uno mientras leías el código de alguien? Eso me pa

programar

es

https://pseint.es/static/images/programar-selectores-explicados-1265-0.jpg

2024-06-13

 

Selectores explicados
Selectores explicados

Si crees que alguno de los contenidos (texto, imagenes o multimedia) en esta página infringe tus derechos relativos a propiedad intelectual, marcas registradas o cualquier otro de tus derechos, por favor ponte en contacto con nosotros en el mail [email protected] y retiraremos este contenido inmediatamente

 

 

Update cookies preferences