Regra @import do CSS
Definição e uso
A regra @import permite que você importe uma tabela de estilos para outra tabela de estilos.
A regra @import deve estar localizada no topo do documento (mas após qualquer declaração @charset).
A regra @import suporta consultas de mídia, permitindo importações dependentes do meio.
Exemplo
Exemplo 1
Importa a tabela de estilos "navigation.css" para a tabela de estilos atual:
@import "navigation.css"; /* Usando string */
ou
@import url("navigation.css"); /* Usando url */
Exemplo 2
Importa a tabela de estilos "printstyle.css" apenas quando o meio é print:
@import "printstyle.css" print;
Exemplo 3
Importa a tabela de estilos "mobstyle.css" apenas quando o meio é screen e a largura máxima da viewport é de 768 pixels:
@import "mobstyle.css" screen and (max-width: 768px);
sintaxe do CSS
@import url|string list-of-mediaqueries;
valor do atributo
| valor | descrição |
|---|---|
| url|string | url ou string, representando a localização do recurso a ser importado. url pode ser absoluta ou relativa. |
| list-of-mediaqueries | Uma lista de consultas de mídia separada por vírgula, que determina as condições sob as quais as regras de CSS importadas pelo URL são aplicadas. |
Suporte do navegador
Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 5.5 | 1.0 | 1.0 | 3.5 |
