Pourquoi utiliser des feuilles de style ? Cascading Style Sheet
Le principe de base est le suivant : il faut séparer le contenu de la page, de son apparence.
La page html contient l’information, et non la façon dont l’information est affichée. Pour un unique contenu : plusieurs affichages sont possibles.
On peut penser à des affichages monochrome, sur de petits écrans, oral (le contenu de la page web est lu), une impression papier, impression sur des transparents, impression en braille…
Versions de CSS
– CSS1 publié en 1996 .
– CSS-P (css positioning) permet le positionnement d'éléments
– CSS2 est une recommandation de mai 1998 qui inclue les attributs des deux précédentes versions. L'accent a été mis sur l'accessiblité et la capacité à avoir un style différent selon les media.
– CSS3 : encore en cours de construction.
Nouveautés : multicolonnage, SVG, styles sur les polices (embossage...), arrondir les coins des boîtes, utiliser des images de fond dans les bordures, des ombres portées...
Qu’est ce qu’un style ?
Les styles regroupent différents attributs, tels que les choix de police, de taille de couleur à appliquer à des titres, des sous-titres …
C’est ce que va faire le CSS : permettre de définir ces attributs dans la page html à l’aide d’un code séparé en utilisant les balises html comme <h1> …</h1> qui de base en html possède une taille, une graisse non modifiable en html, mais complètement redéfinissable en css.
Propriétés des css
Police : taille, style, couleur.
Texte : alignement, casse, interlignage, espace entre les mots et les lettres.
Arrière-plans : couleur ou images.
Bords et marges : marges, remplissages, largeur, hauteur.
Bordures : style, épaisseurs, couleurs.
Interface : puces, indentation, curseur.
Positionnement : emplacement exact sur l’écran.
Affichage et visibilité : si un élément apparaît et comment.
Impression : comment définir l'aspect de la page à l'impression.