@import

La règle @ @import est utilisée afin d'importer des règles à partir d'autres feuilles de style. Ces règles @ doivent être utilisées avant toutes les autres règles, à l'exception de @charset. @import n'est pas une instruction imbriquée et ne peut donc pas être utilisée à l'intérieur de groupe de règles conditionnelles.

Afin que les agents utilisateurs évitent de récupérer des ressources pour des types de média qui ne sont pas pris en charge, les auteurs peuvent définir des règles @import spécifiques à chaque média. Ces imports conditionnels comportent une liste de requête média séparées par des virgules, situées après l'URL. Si aucune requête média n'est indiquée, l'import est inconditionnel. Cela aura le même effet que d'utiliser la requête média all.

Syntaxe

@import url;
@import url liste-requetes-media;

où on a :

url
Une valeur de type <string> ou <uri> qui représente l'emplacement de la ressource qu'on souhaite importer. L'URL peut être absolue ou relative. On notera que l'URL ne pointe pas nécessairement vers un fichier, elle peut simplement définir le nom du paquet et la partie utilisée, le fichier approprié sera alors choisi automatiquement (e.g. chrome://communicator/skin/). Voir cet article pour plus d'informations.
liste-requetes-media
Une liste de requêtes média séparées par des virgules qui conditionnent l'application des règles CSS pour l'URL associée. Si le navigateur ne prend en charge aucune des requêtes indiquées, il ne charge pas la ressource associée.

Syntaxe formelle

@import [ <string> | <url> ] [<media-query-list>]?;

Exemples

@import url("fineprint.css") print;
@import url("bluish.css") projection, tv;
@import 'custom.css';
@import url("chrome://communicator/skin/");
@import "common.css" screen, projection;
@import url('landscape.css') screen and (orientation:landscape);

Spécifications

Spécification État Commentaires
Media Queries
La définition de '@import' dans cette spécification.
Recommendation Extension de la syntaxe afin de prendre en charge n'importe quelle requête média et pas uniquement celles sur les types de média.
CSS Level 2 (Revision 1)
La définition de '@import' dans cette spécification.
Recommendation Prise en charge du type <string> pour indiquer l'URL d'une feuille de style. Il est désormais nécessaire d'insérer les règles @import au début du document CSS.
CSS Level 1
La définition de '@import' dans cette spécification.
Recommendation Définition initiale.

Compatibilité des navigateurs

Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari
Support simple (Oui) (Oui) 5.5 (Oui) (Oui)
Fonctionnalité Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple (Oui) (Oui) 5.5 (Oui) (Oui)

Étiquettes et contributeurs liés au document

Étiquettes : 
 Contributeurs à cette page : SphinxKnight, teoli, FredB, VincentN, Fredchat
 Dernière mise à jour par : SphinxKnight,