Règle @import CSS

  • Page précédente
  • Page suivante

Définition et utilisation

La règle @import permet d'importer une feuille de style dans une autre feuille de style.

La règle @import doit être placée en haut du document (mais après toute déclaration @charset).

La règle @import prend également en charge les requêtes média, permettant ainsi l'importation dépendante du média.

Exemple

Exemple 1

Importe la feuille de style "navigation.css" dans la feuille de style actuelle :

@import "navigation.css"; /* Utilisation de la chaîne de caractères */

ou

@import url("navigation.css"); /* Utilisation de l'url */

Exemple 2

Importe la feuille de style "printstyle.css" uniquement lorsque le média est print :

@import "printstyle.css" print;

Essayez-le vous-même

Exemple 3

Importe la feuille de style "mobstyle.css" uniquement lorsque le média est screen et que la largeur maximale de la vue est de 768 pixels :

@import "mobstyle.css" screen and (max-width: 768px);

Essayez-le vous-même

Syntaxe CSS

@import url|string list-of-mediaqueries;

Valeur de l'attribut

Valeur Description
url|string url ou chaîne de caractères, représentant l'emplacement du fichier de ressource à importer. L'url peut être absolu ou relatif.
list-of-mediaqueries Liste de requêtes média séparées par des virgules, déterminant les conditions dans lesquelles les règles CSS introduites par URL s'appliquent.

Prise en charge du navigateur

Les numéros dans le tableau indiquent la première version de navigateur qui prend en charge pleinement cette propriété.

Chrome IE / Edge Firefox Safari Opera
1.0 5.5 1.0 1.0 3.5
  • Page précédente
  • Page suivante