HTML <style> Tag
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>Un titre</h1>
<p>Un paragraphe.</p>
</body>
</html> Plus d'exemples "Essayez-le vous-même" ci-dessous.
Définition et Utilisation
La balise <style> est utilisée pour définir des informations de style (CSS) pour un document.
À l'intérieur de l'élément <style> , vous spécifiez comment les éléments HTML doivent s'afficher dans un navigateur.
L'élément <style> doit être inclus dans la section <head> du document.
Conseils et Remarques
Remarque : Lorsqu'un navigateur lit une feuille de style, il formate le document HTML selon les informations de 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 l'exemple ci-dessous) !
Conseil : Pour lier une feuille de style externe, utilisez la balise <link> .
Conseil : Pour en savoir plus sur les feuilles de style, veuillez lire notre Tutoriel CSS .
Support des Navigateurs
| Élément | |||||
|---|---|---|---|---|---|
| <style> | Oui | Oui | Oui | Oui | Oui |
Attributs
| Attribut | Valeur | Description |
|---|---|---|
| media | media_query | Spécifie pour quel média/appareil la ressource média est optimisée |
| type | text/css | Spécifie le type de média de la balise <style> |
Attributs Globaux
La balise <style> prend également en charge les Attributs Globaux en HTML .
Attributs d'Événement
La balise <style> prend également en charge les Attributs d'Événement en HTML .
Plus d'Exemples
Exemple
Styles multiples 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>Ceci est un titre</h1>
<p>Ceci est un paragraphe.</p>
</body>
</html> Pages Associées
Tutoriel HTML : HTML CSS
Tutoriel CSS : Tutoriel CSS
Référence DOM HTML : Objet Style
Paramètres CSS par Défaut
La plupart des navigateurs afficheront l'élément <style> avec les valeurs par défaut suivantes :
style {
display: none;
}