los @importCSSat-rule se utiliza para importar reglas de estilo de otras hojas de estilo.

Sintaxis

@import url;@import url list-of-media-queries;@import url supports( supports-query );@import url supports( supports-query ) list-of-media-queries;

dónde:

url
Es un o un () que representa la ubicación del recurso a importar. La URL puede ser absoluta o relativa.
lista-de-consultas-de-medios
Es una lista separada por comas de consultas de medios que condicionan la aplicación de las reglas CSS definidas en la URL vinculada. Si el navegador no admite ninguna de estas consultas, no carga el recurso vinculado.
apoya-consulta
Es un o un .

Descripción

Las reglas importadas deben preceder a todos los demás tipos de reglas, excepto @charset normas; ya que no es una declaración anidada, @import no se puede utilizar dentro de las reglas de at de grupo condicional.

Así que eso agente de usuarios pueden evitar la recuperación de recursos para tipos de medios no admitidos, los autores pueden especificar @import normas. Estas importaciones condicionales especifican consultas de medios separadas por comas después de la URL. En ausencia de cualquier consulta de medios, la importación es incondicional. Especificando all porque el medio tiene el mismo efecto.

Sintaxis formal

@import [|][]?;

where
= #

where
= |[ not | only ]?[ and ]?

where
= |||
=
= ||

where
= not
= [ and ]+
= [ or ]+
= ( ) ||

where
= ( [||] )
= [ ) ]| ( )

where
= :
=
= [ '<' | '>' ]? '='?|[ '<' | '>' ]? '='?| '<' '='? '<' '='?| '>' '='? '>' '='?

where
=
= | ||

Ejemplos de

Importación de reglas CSS

@import'custom.css';@importurl("chrome://communicator/skin/");

Importar reglas CSS de forma condicional

@importurl("fineprint.css") print;@importurl("bluish.css") speech;@import"common.css" screen;@importurl('landscape.css') screen and(orientation:landscape);

Especificaciones

Especificación Estado Comentario
Nivel 4 de herencia y cascada de CSS
La definición de ‘el @import regla ‘en esa especificación.
Recomendación candidata Se extendió la sintaxis para admitir la @supports sintaxis.
Nivel 3 de herencia y cascada de CSS
La definición de ‘@import’ en esa especificación.
Recomendación
Preguntas de los medios
La definición de ‘@import’ en esa especificación.
Recomendación Se amplió la sintaxis para admitir cualquier consulta de medios y no solo tipos de medios simples.
CSS Nivel 2 (Revisión 1)
La definición de ‘@import’ en esa especificación.
Recomendación Soporte agregado para para indicar la URL de una hoja de estilo,
y requisito de insertar el @import regla al principio del documento CSS.
Nivel 1 de CSS
La definición de ‘@import’ en esa especificación.
Recomendación Definición inicial

Compatibilidad del navegador

Escritorio Móvil
Cromo Borde Firefox explorador de Internet Ópera Safari WebView Android Chrome Android Firefox para Android Opera Android Safari en IOS Internet de Samsung
@import 1 12 1 5.5 3,5 1 ≤37 18 4 10.1 1 1.0

Ver también

  • @media
  • @supports