Bases du langage CSS

Nous avons déjà passé en revue les principales balises du langage HTML et il est maintenant temps de l'embellir. Nous aimerions avoir la possibilité de changer la couleur du texte, sa taille, l'arrière-plan et bien plus encore. Cela se fait à l'aide du langage CSS.

Généralement, les commandes CSS (styles) sont stockées dans un fichier séparé, qui est lié par une balise spéciale à toutes les pages HTML de notre site.

L'avantage de cette approche est que le fichier CSS est unique, alors qu'il peut y avoir n'importe quel nombre de fichiers HTML, même mille. Si nous apportons une modification à un endroit du fichier CSS, par exemple, si nous colorons tous les paragraphes en rouge, ces modifications s'appliqueront sur l'ensemble des mille pages HTML auxquelles notre fichier CSS est lié. Très pratique et rapide.

Le fichier de styles doit avoir l'extension .css. Pour connecter un tel fichier à une page HTML, dans la balise head, vous devez écrire la construction suivante :

<link rel="stylesheet" href="fileName.css">

Dans l'exemple suivant, le fichier CSS styles.css est lié à notre fichier HTML :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>This is the title</title>
		<link rel="stylesheet" href="styles.css">
	</head>
	<body>
		<p>
			This is a paragraph with text.
		</p>
	</body>
</html>

Créez et liez à toutes vos pages le fichier styles.css.