Règle CSS @import

La règle CSS @import est utilisé pour importer des règles de style à partir d'autres feuilles de style et pour prendre en charge les requêtes média. Le mot clé @import doit être suivi de l'URI de la feuille de style pour inclure. Une chaîne est également autorisée. Il doit figurer en haut du document, mais après la règle @charset.

La propriété @import ne peut pas être utilisée dans le groupe des règles conditionnelles.
Valeur initiale -
Appliquée à -
Héritée Non.
Animable Non.
Version CSS2
Syntaxe DOM object.style.@import = "url";

Syntaxe

@import: url | string list-of-mediaqueries | initial | inherit;

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document </title>
    <style>
      @import url('https://fonts.googleapis.com/css?family=Coiny');
      @import url('https://fonts.googleapis.com/css?family=Lobster');
      .p1 {
      font-family: 'Coiny', cursive;
      }
      .p2 {
      font-family: 'Lobster', cursive;
      }
    </style>
  </head>
  <body>
    <h2>Exemple de la propriété @import</h2>
    <p class="p1">La règle @import vous permet d'importer une feuille de style à un autre feuille de style.</p>
    <p class="p2">La règle @import supporte aussi les requêtes média, donc  vous pouvez autoriser l'importation en fonction du support.</p>
  </body>
</html>

Valeurs

Valeurs Description
url Un <url> ou un <string> montrant l'emplacement de la ressource à importer. L'URL peut être relative ou absolue.
string list-of-mediaqueries Une liste de requêtes multimédia séparées par des virgules conditionnant l'application des règles CSS définies dans l'URL liée.
initial Fait utiliser la valeur initiale.
inherit Hérite la propriété de son élément parent.

Support de Navigateurs

1.0+


Trouvez-vous cela utile?

Articles Associées