SELFHTML/Aides à la navigation HTML/XHML Éléments HTML avancés |
Passages de feuilles de style en HTML |
|
Définir des passages de feuilles de style |
|
Pour définir à l'aide de feuilles de style des formats globaux, vous pouvez définir dans l'entête d'un fichier HTML un ou plusieurs passages de feuilles de style.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Texte du titre</title> <style type="text/css" media="screen"> <!-- body { background-image:url(retour.jpg); padding:10px; } #grandtexte { font-size:150px; font-family:"Arial Black",Arial,sans-serif; color:#73FBE7; } #petittexte { font-size:90px; font-family:"Arial Black",Arial,sans-serif; color:#FFFFFF; } --> </style> </head> <body> <div id="petittexte">feuilles de style</div> <div id="grandtexte">CSS</div> </body> </html> |
Avec <style>
vous introduisez dans l'entête de fichier à savoir entre <head>
et </head>
un passage pour la définition de formats (style = style ), avec </style>
vous fermez ce passage. Les formats que vous définissez dans ce passage d'après la syntaxe du langage de feuilles de style s'appliquent alors à la totalité du fichier.
Dans le repère d'ouverture <style>
vous devez mentionner avec l'attribut type=
, quel langage de feuilles de style vous désirez utiliser pour définir les formats à
l'intérieur du passage. L'affectation de valeur est constituée du type Mime du langage de feuilles de style désiré. La mention la plus courante pour cela est type="text/css"
. Grâce à cette mention vous définissez les feuilles de style CSS comme langage pour les définitions de format. Mais vous pouvez aussi utiliser d'autres langages. Au cas où vous désirez mettre en oeuvre plusieurs langages de style dans le même fichier HTML, définissez simplement pour chaque langage un passage style
. Tous les passages doivent figurer dans l'entête de fichier.
Avec l'attribut media=
, qui n'est pas obligatoire à la différence de type=
, vous pouvez fixer le type de média de sortie. Outre l'affectation de valeur screen
(pour le média "écran") mentionnée dans l'exemple ci-dessus, il existe d'autres mentions possibles - voir à ce sujet la partie traitant des diverses feuilles de style séparées pour différents médias de sortie. Vous pouvez en définissant plusieurs passages style
, qui ont tous des attributs media
différents, définir des feuilles de style pour différents média de sortie.
Il est recommandé de placer le contenu de passages de feuilles de style dans un texte non affiché (commentaires) (<!--
à -->
), comme dans l'exemple ci-dessus. Vous éviterez ainsi que des navigateurs plus anciens
affichent par erreur le contenu comme texte.
Les mentions de feuilles de style proprement dites ne seront pas traitées plus en détail ici. Lisez sur ce thème les parties correspondantes de cette documentation.
Dans le sommaire de référence HTML vous trouverez des données précisant où les passages de style peuvent être mis, quels autres éléments ils peuvent contenir, quels attributs ils peuvent avoir et ce à quoi il faut veiller pour ces différents attributs:
référence pour les éléments pour les passages de style
référence pour les attributs pour les passages de style
Passages Script en HTML | |
Ranger et contrôler les calques | |
SELFHTML/Aides à la navigation HTML/XHML Éléments HTML avancés |
© 2001 Stefan Münz / © 2003 Traduction Serge François, 13405@free.fr
selfhtml@fr.selfhtml.org