Cours CSS – Syntaxe des feuilles de styles, tutoriel & guide de travaux pratiques en pdf.

Définition d’un style

Pour définir un style, il faut écrire:
• Les balises XHTML (séparées par des virgules s’il y en a plusieurs) auxquelles il doit s’appliquer.
• Les différents attributs du style enfermés entre deux accolades, chacuns séparés des autres par un point virgule.
Balise1, Balise2 {
propriété de style: valeur;
propriété de style: valeur
}
Exemple:
H4, P {
font-family: Arial;
font-style: italic;
font-color: green
}
Les paragraphes et les titres de niveau 4 seront en vert, en italique, et en police Arial. * est un caractère générique, il permet d’attribuer un style à tous les éléments de la page.
Sélecteurs contextuels
Il est possible de sélectionner une balise en fonction des éléments qui l’entourent, grâce aux sélecteurs contextuels :
Eléments imbriqués
Balise1 Balise2 {
/* style; */
}
Deux balises non séparées par une virgule permettent d’appliquer un style seulement si la Balise2, se trouve dans la Balise1.
Le code suivant ne s’appliquera qu’à texte1.
code p {
color: blue;
}
Eléments consécutifs
Balise1+Balise2 {
/* style; */
}
Deux balises successives séparées d’un signe + permettent d’appliquer le style seulement si la Balise2, suit directement la Balise1.
Exemple :
texte
texte1
texte2
Le code suivant ne s’appliquera qu’au texte1.
i+p {
color: blue;
}
Les commentaires
Il est possible de placer des commentaires dans votre feuille de style sans qu’ils soient interprétés par les navigateurs, avec la syntaxe suivante..