La declaración
@import permite importar una hoja de estilos externa dentro de otra hoja de estilos.La sintaxis
El url a utilizar puede aparecer dentro de una anotación funcional url(), o sencillamente entre comillas:
@import url(ruta/estilos.css); @import 'ruta/estilos.css';
La posición dentro de una hoja de estilos
Las declaraciones
@import tienen que preceder cualquier otra regla de la hoja de estilos, con una excepción: puede ser precedida y tiene que ser precedida por la declaración @charsert.@charset "utf-8"; @import url(ruta/estilos.css);
@import y @media
Tampoco puede ser utilizada dentro de un bloque
@media, aunque sí es posible importar una hoja de estilos externa para ser utilizada con un cierto tipo de media.
@import url(estilos/print.css) print;
. . . .
@media print {
/* las reglas CSS van aquí */
}
Para tener en cuenta
La declaración
@import puede tener un efecto negativo en el rendimiento de la página.Algunos ejemplos
@import url("print.css") print;
@import url("speech.css") speech;
@import 'custom.css';
@import url("chrome://communicator/skin/");
@import "common.css" screen;
@import url('landscape.css') screen and (orientation:landscape);
@import url(https://fonts.googleapis.com/css?family=Raleway:400);
@import 'https://fonts.googleapis.com/css?family=Raleway:400)';

0 Comentarios