Introducción a CSS



Introducción a CSS
Javier Eguíluz Pérez
1.8.1. Medios definidos con las reglas de tipo @media
Las reglas @media son un tipo especial de regla CSS que permiten indicar de
forma directa el medio o medios en los que se aplicarán los estilos incluidos
en la regla. Para especificar el medio en el que se aplican los estilos, se incluye
su nombre después de @media. Si los estilos se aplican a varios medios, se
incluyen los nombres de todos los medios separados por comas.
A continuación se muestra un ejemplo sencillo:
@media print {
body { font-size: 10pt }
}
@media screen {
body { font-size: 13px }}
@media screen, print {
body { line-height: 1.2 }
}
El ejemplo anterior establece que el tamaño de letra de la página cuando se
visualiza en una pantalla debe ser 13 píxel. Sin embargo, cuando se imprimen
los contenidos de la página, su tamaño de letra debe ser de 10 puntos. Por último,
tanto cuando la página se visualiza en una pantalla como cuando se imprimen sus contenidos, el interlineado del texto debe ser de 1.2 veces el tamaño de letra del
texto.
1.8.2. Medios definidos con las reglas de tipo @import
Cuando se utilizan reglas de tipo @import para enlazar archivos CSS externos, se
puede especificar el medio en el que se aplican los estilos indicando el nombre del medio después de la
URL del archivo CSS:
@import url("estilos_basicos.css") screen;
@import url("estilos_impresora.css") print;
Las reglas del ejemplo anterior establecen que cuando la página se visualiza por
pantalla, se cargan los estilos definidos en el primer archivo CSS. Por otra parte,
cuando la página se imprime, se tienen en cuenta los estilos que define el segundo archivo CSS.
Si los estilos del archivo CSS externo deben aplicarse en varios medios, se indican
los nombres de todos los medios separados por comas. Si no se indica el medio en
una regla de tipo @import, el navegador sobreentiende que el medio es all, es decir, que los estilos se aplican en todos los medios.
Fuente: Introducción a CSS
Javier Eguíluz Pérez

Entradas populares de este blog

CERRAR SESIÓN o APAGAR EL EQUIPO.

Curso Excel 2010 4.3. Ampliar o reducir una selección

GLOSARIO CV: Tag