Introduction au CSS

Les feuilles de style en cascade CSS “Cascading Style Sheets”
(CSS) est un outil pour la présentation des sites Web. Elles peuvent faire gagner beaucoup de temps, et elles permettent de créer des sites Web de façon entièrement nouvelle.
L’utilisation de CSS nécessite une connaissance de base de HTML.

La syntaxe CSS de base

Exp: le fond d’une page Web bleue:
Avec HTML :

<body bgcolor="#FF0000">

Avec CSS :

body {background-color: #0000FF;}

Appliquer CSS à un document HTML
Il existe 3 façons
Méthode 1 : Dans la ligne (l’attribut style)
Avec l’attribut HTML style.
Exp :

<html> 
<head> 
      <title>mon titre</title> 
</head> 
<body style="background-color: #0000FF;">
    <p>Cette page est blue</p> 
</body> 
</html>

Méthode 2 : Interne (l’élément style)
Une autre méthode consiste à inclure le code CSS avec la balise HTML <style>.
Exp:

<html> 
<head>
 <title>mon titre</title>
 <style type="text/css"> 
     body {background-color: #0000FF;} 
 </style> 
</head> 
<body> 
<p>Cette page est blue</p> 
</body>
 </html>

Méthode 3 : Externe (un lien vers une feuille de style)
La méthode recommandée est celle avec un lien vers feuille de style externe.
Une feuille de style externe est un fichier texte ayant l’extension « .css ».
Exp: votre feuille de style se nomme « style.css » et se trouve dans le même dessier que la page html.
On crée un lien depuis (ex1.html) vers la feuille de style (style.css). Ce lien peut être créé en une ligne de code HTML :

<link rel="stylesheet" href="style.css" />

La ligne de code doit être ajouté entre les balises <head> et </head>.