Les CSS

Ce sigle est l’acronyme de Cascading Style Sheet (feuille de style en cascade). Le principe est le même que celui des feuilles de style dans les logiciels de PAO ou de bureautique. Il s’agit d’appliquer une mise en forme prédéfinie à une portion de texte. Comme une mise en forme exige en général plusieurs paramètres, l’utilisation des CSS permet de gagner du temps.

Les principales mises en forme qui peuvent être définies par les feuilles de style sont les suivantes :

• les attributs typographiques de base (police, corps, couleur, graisse,…)

• l'alignement (fer à gauche, fer à droite, centré, justifié)

• l'interlignage

• les approches

• la mise en forme des hyperliens

• les marges

• la modification de l'apparence de certains objets de formulaire

• la couleur de fond du texte

Il y a 3 manières d'appliquer des feuilles de style à un texte. IL s'agit de savoir quels seront les sélecteurs c'est à dire de quelle manière seront délimitées les zones de texte auxquelles les styles doivent s'appliquer.

• La méthode la plus courante et la plus sûre consiste à utiliser les balises HTML (généralement celles qui assurent un balisage logique) comme sélecteurs. L'intérêt de cette méthode est de conserver une compatibilité avec les navigateurs qui ne savent pas interpréter les CSS. On va par exemple structurer les différents niveaux de titres en utilisant les balise H1, H2, H3… La hiérarchie des titres sera respectée par tous les navigateurs et les navigateurs compatibles CSS les afficheront avec les attributs typographiques spécifiques que nous aurons choisis avec les styles.

Cette méthode est celle que nous avons choisi d'utiliser sur ce site.

• Il est également possible d’appliquer un style à une zone de texte qui ne correspond pas à un balisage HTML en créant une classe. Cette technique est plus délicate à mettre en œuvre et elle doit être utilisée avec précaution.

• Enfin, il est aussi possible de créer des indentifiants qui permettront d'apliquer un style à une seule zone de texte. La prudence est là aussi recommandée.

Il est possible de placer une feuille de style dans un fichier spécifique (on parle alors de feuille de style externe) auquel des pages ou même toutes les pages d'un site feront appel. C'est ce qui se passe sur commentfaireunsite.com.

On insère dans l'en-tête de la page la ligne suivante :


<link rel: "STYLESHEET" href="style.css" type="text/css">


qui permet d'appeler le fichier externe qui définit les styles.
Pour information nous décrivons dans le tableau ci-dessous le contenu des styles utilisés sur ce site (i.e. les styles définis dans le fichier externes en .css).


Ressources
Ressources

Balise de structure

Fonction

Attributs

   

Couleur

Graisse Taille (px) Police Alignement style
H1 (Titre 1) Titre de niveau 1 maroon Gras 40 jeu arial Fer à gauche   
H2 (Titre 2) Titre de niveau 2 maroon Gras 30 jeu arial Fer à gauche    
H3 (Titre 3) Titre de niveau 3 maroon Gras 25 jeu arial Fer à gauche   
H4 (Titre 4) Titre de niveau 4 Noir Gras 15 jeu arial Fer à gauche   
cite (Citation) Italique Noir Gras   jeu arial     italique
code (code) code navy          
strong (Accentuation) Gras dans le texte Noir Gras          
P (Paragraphe) Texte courant Noir Gras  12 jeu arial Justifié   
A (Lien)  Lien Noir   Gras   jeu arial