Començament CSS
CSS confia en regles de coincidència de patrons per determinar quin estil s'aplica a quin element del document. Aquests patrons s'anomenen selectors i van des dels noms d'etiquetes (per exemple, p per coincidir amb les etiquetes de paràgraf) fins a patrons molt complexos que coincideixen amb parts molt específiques d'un document (per exemple, p # myid> b.highlight coincidirà amb qualsevol etiqueta b amb una classe de ressaltat que és un nen del paràgraf amb el identificador myid).
Un selector CSS és la part d'una crida d'estil CSS que identifica quina part de la pàgina web hauria d'estar estilitzada. El selector conté una o més propietats que defineixen com es dissenyarà l' HTML seleccionat.
Els selectors CSS
Hi ha diversos tipus de selectors diferents:
- tipus selectors que coincideixen amb un element específic
- Elements de selecció de classe amb una classe específica
- Selector d'identificació que coincideix amb l'element amb una identificació específica
- selectors descendents : elements que són descendents d'un element específic
- Elements de selecció de secundaris que són elements secundaris de l'element específic
- selectors universals que coincideixen amb qualsevol element
- Elements adjacents de germans-elements coincidents immediatament precedits d'un element específic
- Elements d'atribució d'atributs amb un atribut específic o valor d'atribut
- Elements de coincidència de selectors pseudo-class amb una pseudo classe específica
- elements de coincidència de selectors de pseudo-element amb propietats específiques de pseudo-element
Format CSS Estils i CSS Selectors
El format d'un estil CSS és així:
selector {style property: style; }
Separa els selectors múltiples que tenen el mateix estil amb comes. S'anomena agrupació de seleccions. Per exemple:
selector1 , selector2 {style property: style; }
Agrupar selectors és un mecanisme de taquigrafia per mantenir compactes els estils CSS.
L'agrupació anterior tindria el mateix efecte que:
selector1 {style property: style; }
selector2 {style property: style; }
Proveu sempre els seleccions CSS
No tots els navegadors admeten tots els selectors CSS. Així que assegureu-vos de provar els vostres selectors en tants navegadors en tants sistemes operatius com pugueu. Però si esteu utilitzant els selector CSS 1 o CSS2, hauríeu d'estar bé.