Pour insérer un style dans un document il existe plusieurs méthodes :
Directement sous forme d'attribut dans la balise à modifier (solution à déconseiller notamment pour la maintenance future et pour le poids du code HTML ou XHTML qui ne fait qu'augmenter).
Exemple :
<p style="text-align:center">Texte centré</p>
Au début du document HTML (entre les balises <head> et </head> par l'intermédiaire d'une balise <style>). Solution à déconseiller aussi pour la même raison que la première.
Exemple :
<style type="text/css">
p{
text-align:center;
}
</style>
p{
text-align:center;
}
</style>
Par l'intermédiaire d'une feuille de style externe (située sur votre serveur). Solution à recommander car elle permet une économie de code et une maintenance simplifiée.
Exemple :
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
Dans notre cas ce code se place entre les balises <head><;/strong> et </head>. Nous appelons la feuille de style située dans le répertoire courant et nommée style.css. Celle-ci sera utilisée seulement pour l'affichage à l'écran (car l'attribut media est égal à screen). Il existe différents attributs comme print (pour l'impression du document), projection (projection via un vidéo projecteur par exemple)...
Par l'intermédiaire d'une feuille de style externe (située sur un autre serveur). Solution à recommander si vous ne souhaitez pas opter pour la précédente.
Exemple :
<style type="text/css">
@import url('http://www.site.com/style.css');
</style>
Ce code se place entre les balises <head> et </head>. Nous appelons la feuille de style située dans le répertoire courant du site site.com et nommée style.css. Celle-ci sera utilisée seulement pour l'affichage à l'écran (car l'attribut media est égal à screen).
