Balise HTML <style>
Exemple
Utilisation de l'élément <style> pour appliquer une feuille de style simple à 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>
Plus d'exemples "Essayez-le vous-même" ci-dessous.
Définition et utilisation
La <style>balise est utilisée pour définir les informations de style (CSS) pour un document.
À l'intérieur de l' <style>élément, vous spécifiez comment les éléments HTML doivent s'afficher dans un navigateur.
Conseils et remarques
Remarque : Lorsqu'un navigateur lit une feuille de style, il formate le document HTML en fonction des informations contenues dans la feuille de style. Si certaines propriétés ont été définies pour le même sélecteur (élément) dans différentes feuilles de style, la valeur de la dernière feuille de style lue sera utilisée (voir exemple ci-dessous) !
Conseil : Pour créer un lien vers une feuille de style externe, utilisez la balise <link> .
Astuce : Pour en savoir plus sur les feuilles de style, veuillez lire notre Tutoriel CSS .
Prise en charge du navigateur
| Element | |||||
|---|---|---|---|---|---|
| <style> | Yes | Yes | Yes | Yes | Yes |
Les attributs
| Attribute | Value | Description |
|---|---|---|
| media | media_query | Specifies what media/device the media resource is optimized for |
| type | text/css | Specifies the media type of the <style> tag |
Attributs globaux
La <style>balise prend également en charge les attributs globaux en HTML .
Attributs d'événement
La <style>balise prend également en charge les attributs d'événement en HTML .
Plus d'exemples
Exemple
Plusieurs styles pour les mêmes éléments :
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
<style>
h1 {color:green;}
p {color:pink;}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This
is a paragraph.</p>
</body>
</html>
Pages connexes
Tutoriel HTML : HTML CSS
Tutoriel CSS : Tutoriel CSS
Référence HTML DOM : Style d'objet
Paramètres CSS par défaut
La plupart des navigateurs afficheront l' <style>élément avec les valeurs par défaut suivantes :
style {
display: none;
}