Table des matières

HTML + CSS, sélecteurs

Le sélecteur permet de cibler les éléments dans le document. Les propriétés et valeurs permettent de définir l'habillage de ces éléments.

[SELECTEUR] { 
[PROPRIETE]: [VALEUR]; 
}

Sélecteur

Pour viser les balises d'un type particulier, il suffit d'écrire son nom!

Exemple: p.

Pour viser les balises ayant une classe particulière, il suffit d'écrire le nom de la classe précédée d'un point.

Exemple: .nomdelaclasse

Pour viser les balises ayant un identifiant particulier, il suffit d'écrire le nom de l'identifiant précédé d'un dièse.

Exemple: #nomdelidentifiant

Il est possible de combiner les sélecteurs : Séparés par des virgules pour cumuler les éléments (“et”).

Exemple: h1, p, .article

Séparés par des espaces pour cibler l'enfant d'une hiérarchie (“dans”).

Exemple: div .article h2


Propriétés

Il existe de nombreuses propriétés, quelques exemples.

commentaire: /* commentaire */

background:

font:

text:

marge extérieure:

marge intérieure:

bordure:

/* commentaire */

background-image: url(nom.jpg);
background-size: 100% , 100%; 
background-attachment: fixed;

font-size: 30px; 
font-family: arial, sans-serif;

text-align: center justify left right;

margin: 30px;
padding: 20px;

border: 4px solid black;


Mémento CSS