Expand your HTML skills through an MDN Fellowship - Apply by April 1 http://mzl.la/MDNFellowship

mozilla
Vos résultats de recherche

    <style>

    Résumé

    L'élément HTML <style> contient les informations de style pour un document ou une partie de ce document. Il faut mettre les informations de style à l'intérieur de cet élément, normalement en utilisant le langage CSS (voir CSS).

    • Catégories de contenu Contenu de méta-données, si l'attribut scoped est présent : contenu de flux
    • Contenu autorisé Dépend de la valeur de l'attribut type.
    • Omission de balises Aucune, tant le tag d'ouverture que de fermeture est obligatoire
    • Éléments parents autorisésDes éléments pouvant accepter du contenu de méta-données si l'attribut scoped est absent.
      Un élément <noscript> qui est le fils d'un élément <head> si l'attribut scoped est absent.
      Si l'attribut scoped est présent, des éléments pouvant accepter du contenu de flux, à condition que l'élément style soit présent avant tout autre contenu de flux qui ne soit pas un blanc et que l'élément style ne soit pas le fils d'un élément dont le modèle de contenu soit transparent.
    • Interface DOM Cet élément implémente les interfaces HTMLStyleElement et LinkStyle.

    Attributs

    Cet élément accepte les attributs globaux.

    type
    Cet attribut définit le langage de style utilisé, sous la forme d'un type MIME (le jeu de caractères ne doit pas être spécifié). 'text/css' est la valeur par défaut si l'attribut n'est pas précisé.
    media
    Cet attribut définit pour quel media de destination le style doit être appliqué. Il faut préciser une media query, voir http://dev.w3.org/csswg/css3-mediaqueries.
    scoped
    Si cet attribut est présent, le style ne s'applique qu'à l'élément parent. S'il est absent, le style s'applique au document entier. Voir les specifications WhatWG.
    title
    Cet attribut définit un ensemble de feuille de styles alternatives.
    disabled
    S'il est présent, les propriétés de style qui sont spécifiées dans l'élément ne sont pas appliquées au document.

    Exemples

    <style type="text/css">
body {
  color:red;
}
</style>

    Exemple de l'attribut scoped

    <article>
  <h1>Scoped stylesheet</h1>
  <div>L'attribut scoped vous permet de placer l'élément style au milieu du document.
   Les propriétés à l'intérieur sont alors appliquées à l'élément parent.</div>
  <p>Ce texte est noir.</p>
  <section>
    <style scoped>
      p { color: red; }
    </style>
    <p>Celui-là est rouge.</p>
  </section>
</article>

    Pour voir un exemple d'utilisation :

    Spécifications

    Spécification Statut Commentaires
    WHATWG HTML Living Standard Living Standard Pas de changement depuis HTML5.
    HTML5 Candidate Recommendation Ajout de l'attribut scoped
    HTML 4.01 Specification Recommendation  

    Compatibilité des navigateurs

    Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
    Support simple (Oui) 1.0 (1.7 ou moins) (Oui) (Oui) (Oui)
    scoped 20 [1] 21.0 (21.0)[2] Pas de support Pas de support Pas de support
    Fonctionnalité Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
    Support simple (Oui) 1.0 (1.7 ou moins) (Oui) (Oui) (Oui)
    scoped ? 25.0 (25.0)[2] Pas de support Pas de support Pas de support

    [1] Supporté dans les versions supérieures à Chrome 20 en choisissant "Activer <style scoped>" ou en activant "fonctionnalités expérimentales WebKit" dans chrome://flags.
    [2] Gecko 20 ou ultérieur implémente les pseudo-classes :scope pseudo-classes, mais il est nécessaire que la préférence layout.css.scope-pseudo.enabled soit mise à true. C'est le cas par défaut dans les versions de test Nightly et Aurora.

     

    Voir aussi

    • L'élément <link>, permettant l'utilisation de feuilles de style externes.

    Étiquettes et contributeurs liés au document

    Étiquettes : 
    Contributors to this page: Matouche, tregagnon, Goofy, SphinxKnight
    Dernière mise à jour par : SphinxKnight,