Secció 2: Selectors

1. Selectors bàsics: elements HTML

És el cas més elemental i consisteix senzillament a utilitzar com a selector un element HTML. Utilitzar un selector HTML significa que totes les aparicions de l'element a l'arxiu .html estaran afectades per l'estil definit per a aquest selector.

Nota: si tens dubtes sobre el significat del terme 'element' pots revisar la Secció 0, apartat 3: 'Element vs. Tag'.

Gairebé qualsevol element HTML pot usar-se com a selector, però cadascun acceptarà unes determinades propietats (ho veurem més endavant). Exemples típics d'elements usats com a selectors serien BODY, P o H1. Hi ha alguns elements que no poden ser selectors, com ara TITLE o LINK.

BODY {
margin-top: 30px;
margin-left: 20px; }

P {
font-family: Verdana;
color: #ffff00; }

H1 {
font-size: 16px;
text-decoration: underline; }

En aquest cas tots els paràgrafs del text tindran la font Verdana i el color #ff0000 (vermell).

La principal limitació d'aquest tipus de selector és que ofereix poca varietat d'estils al document (què passa si volem tenir diferents tipus de paràgrafs?). Veurem de seguida que hi ha altres selectors que ens permetran resoldre aquest problema, com els selectors de classe o els selectors contextuals.