ISN
Lycée Faidherbe, 2019-2020

Les Bases du CSS.

Un document CSS, pour Cascade Style Sheet, se caractérise par une extension .ccs. Il contient du texte qui décrit les propriétés des éléments HTML dont on désire préciser le style : couleur, taille, position etc.....

On peut donc créer un fichier css avec un éditeur de code ou un simple traitement de texte. Il suffit de ne pas oublier de spécifier son extension .css

1. Lier sa page HTML et son fichier .css

Pour le lier à la page HTML qui le concerne, il est nécessaire d'ajouter un élément link dans le header de la page HTML.

              
                
                
<head>
    <meta charset="UTF-8">
    <title>Le css de manière facile</title>
    <link href="style.css" rel="stylesheet" type="text/css">
</head>
                
               

La propriété href de l'élément link donne le chemin relatif de la page html vers le fichier css.

2. Définir une règle de style à appliquer à certains éléments HTML.

Si l'on désire que tous les éléments h1 soient en rouge, on utilise un sélecteur css. Pour un élément html,il suffit d'écrire cet élément et de déclarer ensuite la propriété CSS que l'on désire appliquer.

              
/* dans le fichier css, on édite la règle à appliquer */
h1 {
    color :blue;
    }

<!-- dans la page HTML, on a un élément h1 :-->
<h1>Un titre de niveau 1</h1>

              
              
On obtient le résultat

Un titre de niveau1

3. Combiner les sélecteurs.

La mise en forme du texte.

La mise en forme des blocs.

La gestion des images.

Le positionnement des blocs.

Les marges extérieures et intérieures.

Flex : un système de positionnement très flexible.

Grid : un système de positionnement par grille.

Les pseudo-classes pour modifier la forme selon les actions de la souris.

Réaliser des animations en CSS.