02 - Comment et où ajouter le CSS

Il y a plusieurs façons d'ajouter du CSS. Chaque méthode peut être cumulée et chaque méthode possède des avantages et inconvénients.

Dans la balise HEAD

Utiliser une feuille de style en ligne: vous pouvez utiliser la balise <style> dans la section <head> de votre document HTML pour inclure du code CSS directement dans la page.

<head>
	<style>
		h1 {
		    text-align: center;
		}
	</style>
</head>

A l'aide d'une feuille de style

Utiliser une feuille de style externe: vous pouvez créer un fichier CSS séparé avec l'extension .css et le lier à votre page HTML en utilisant la balise <link> dans la section <head> de votre document HTML.

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

Via l'attribut d'une balise (en "inline")

Utiliser l'attribut "style" : vous pouvez utiliser l'attribut "style" directement sur une balise HTML pour appliquer des styles à un élément spécifique.

<body>
	<h1 style="color:red;">Mon titre principal</h1>
</body>

Utilisations des méthodes

La plupart du temps, il sera conseillé d'utiliser un fichier séparé pour placer votre CSS, pour les raisons suivantes :

Le CSS, bien que complémentaire au HTML est un language bien à part. Et idéalement, et ce dans plusieurs métiers de programmation, utiliser un fichier par langue sera préférable. Cela vous apportera plus de clarté personnellement mais si vous travaillez en équipe, le partage des tâches sera bien plus pratique.
Globalité. Il ne suffit qu'une seule ligne pour indiquer à une page html d'utiliser du CSS. Ainsi, si vous disposez de 25 pages et que chacune possède le lien vers le fichier CSS, vos pourrez modifier votre CSS une fois pour qu'il s'applique à toutes les pages.
Lisibilité : le code sera bien plus lisible dans son fichier qu'inséré au milieu de nul part dans un code HTML.

Ensuite, les autres méthodes sont utilisés pour des raisons opposées. Il vous sera par exemple intéressant d'utiliser une balise "style" dans un document pour n'appliquer du CSS que sur une seule page.

Ou écraser le comportement d'un titre particulier.