Freddy Montes Profile picture
🇨🇷 🇻🇪 Frontend Developer y Diseñador UI. Te enseño a programar y diseñar #webapps. Descarga mi #ebook de web development gratis en https://t.co/sGhcriGHOW

Nov 4, 2021, 7 tweets

Te explico 4 selectores de #CSS que quizás no conocías o quizás si, no sé, pero igual te los explico.

❤️ RT para que todos aprendamos

🧵 THREAD

Se llaman "Selectores Parciales" te permite seleccionar elementos haciendo match parcial o completo del valor de sus atributos.

Para aplicarlos se usan [] y dentro el nombre del atributo y el valor.

Empecemos con el más común "igual" y se representa con el símbolo = .

Seleccionamos un elemento que tenga el atributo "lang" con el valor igual a "en-US".

Ahora vamos a seleccionar cuando el valor del atributo comience con "algo", y para eso usamos ^=

Entonces aquí seleccionamos todos los elementos que tengan un id con un valor que comience con "panel-".

Ahora al contrario, seleccionamos cuando el valor del atributo termine con "algo" y para ese usamos $=

Entonces aquí seleccionamos todos los elementos que tengan un id con un valor que termine con "-dialog".

Y finalmente, seleccionamos cuando el valor del atributo contiene "algo" en cualquier posición y para ese usamos *=

Aquí seleccionamos todos los elementos que contengan la palabra "product" en el valor de su id.

Para resumir, es seleccionar con los "operadores"

= igual
$= termina con
^= comienza con
*= contiene

❤️ Si te gustó este hilo, dale RT al primer tweet.
📕 Descarga mi libro gratis: fmontes.com/99
📸 Sígueme en instagram.com/fmontes

Share this Scrolly Tale with your friends.

A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.

Keep scrolling