Recuerda que en las ciencias un problema casi siempere puede tener diversas soluciones, de igual modo aquí compartiremos lo más óptimo y mejor.
los @import
CSSat-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
Comentarios y valoraciones
Tienes la opción de sustentar nuestro quehacer escribiendo un comentario o valorándolo te lo agradecemos.