Índice

CSS importada (@import)

Otra forma de usar las hojas de estilo externas consiste en usar el comando @import.

<style type="text/css"> 
@import url(ejemplo.css); 
</style>

@import es una propiedad de estilo de CSS 2 (mientras que la etiqueta <link> lo es de HTML). La ventaja consiste en que podrá usarse no solo para invocar una hoja de estilo externa en un documento HTML, sino también para importar otra hoja de estilo en la hoja de estilo externa.

Comentarios

  • Las etiquetas <style> ... </style> son necesarias, pues @import es una propiedad de estilo (CSS 2).

  • No existe espacio entre la arroba y el import.

  • La dirección de la hoja de estilo puede ser global (http:// …) o local.

  • ¡No olvide, especialmente, el punto y coma final! Recodemos que @import es una propiedad de estilo CSS.

  • La etiqueta <link> ya no es necesaria.

El código completo quedaría:

<!DOCTYPE html> 
<html lang="es"> 
<head> 
   <title>Html5</title> 
   <meta charset="UTF-8"> 
   <style type="text/css"> 
   @import url(ejemplo.css); 
   </style> 
</head> 
<body> 
<h1>Título de nivel 1</h1> 
</body> 
</html>

Igual que con los estilos externos, todos los títulos <h1> de todas las páginas del sitio web aparecerían subrayadas por encima.

La captura de pantalla ...