Exemple
L' utilisation du <style> élément dans un document HTML:
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
</head>
<body>
<h1>A heading</h1>
<p>A paragraph.</p>
</body>
</html>
Essayez - le vous - même » Définition et utilisation
Le <style> tag est utilisé pour définir les informations de style pour un document HTML.
A l' intérieur du <style> élément de spécifier comment les éléments HTML doivent rendre dans un navigateur.
Chaque document HTML peut contenir plusieurs <style> tags.
support du navigateur
| Élément | |||||
|---|---|---|---|---|---|
| <style> | Oui | Oui | Oui | Oui | Oui |
Trucs et astuces
Astuce: Pour créer un lien vers une feuille de style externe, utilisez la balise <link> tag.
Astuce: Pour en savoir plus sur les feuilles de style, s'il vous plaît lire notre tutoriel CSS .
Remarque: Si le "scoped" attribut est pas utilisé, chaque <style> balise doit être situé dans la section de la tête.
Différences entre HTML 4.01 et HTML5
Le "scoped" attribut est nouvelle en HTML5, qui permet de définir des styles pour une section spécifique du document. Si le "scoped" attribut est présent, les styles appliquent uniquement à l'élément parent de l'élément et le style des éléments enfant de cet élément.
Les attributs
= Nouveau en HTML5.
| Attribut | Valeur | La description |
|---|---|---|
| media | media_query | Indique quels médias / périphérique de la ressource multimédia est optimisée pour |
| scoped | scoped | Indique que les styles appliquent uniquement à l'élément parent de cet élément et les éléments enfants de cet élément |
| type | text/css | Indique le type de support du <style> tag |
Attributs globaux
Le <style> tag soutient également le attributs globaux en HTML .
Attributs de l'événement
Le <style> tag soutient également l' événement Attributs en HTML .
Pages associées
HTML tutoriel: HTML CSS
CSS tutorial: Tutorial CSS
Référence HTML DOM: Style Object
Paramètres par défaut de CSS
La plupart des navigateurs affichent le <style> élément avec les valeurs par défaut suivantes:
style {
display: none;
}