La déclaration d'une feuille de style se fait dans la partie HEAD de la page html.
Cette déclaration indique à la page où aller chercher les classes appliquées aux éléments
html. Le chemin spécifié dans l'attribut href peut être absolu ou relatif (plus fréquent).
La syntaxe est la suivante :
<link rel="stylesheet" href="MonStyle.css">
Il est également possible de définir des styles au sein d'une page web dans la partie HEAD
avec la balise STYLE :
<head>
<title>Titre de la page</title>
<style>
...
Déclaration des classes
...
</style>
</head>
Les classes définies entre les balises <style> sont uniquement accessibles dans la page
courante. Pour utiliser les classes définies dans une feuille de style ou dans les balises <style>,
il faut utiliser l'attribut class de l'élément html sur lequel le style doit s'appliquer.
Il est également possible d'utiliser l'attribut style au sein des balises html pour
définir des styles supplémentaires.
Dans le cas où les attributs class et style sont tous les deux utilisés au sein
d'une même balise, l'attribut class est le premier à être pris en compte, puis les
styles définis dans l'attribut style sont appliqués à l'élément html.
<span style="font-family:verdana; font-weight:700;">
Du texte ...
</span>
Exemple complet :
<html>
<head>
<title>Exemple de style</title>
<style>
.MaClasse{
font-weight:700;
text-decoration:underline;
}
</style>
</head>
<body>
<span class="MaClasse">Texte avec la class définie en en-tête</span>
<br><br>
<span style="font-family:verdana; font-size:13; color:red;">Texte avec un style défini dans la balise</span>
<br><br>
<span class="MaClasse" style="font-family:verdana; font-size:13; color:red;">
Texte avec les attributs style et class combinés
</span>
</body>
</html>
» Afficher l'exemple
|
