CSS INTERNO
Vamos a ver ahora cómo podemos definir esos estilos en la cabecera del documento HTML usando la siguiente sintaxis:
| <head> … <style type="text/css"> elementoAfectadoPorElEstilo { propiedad1ParaEseTipoDeElementos:valor; propiedad2ParaEseTipoDeElementos:valor; propiedad3ParaEseTipoDeElementos:valor; … propiedadnParaEseTipoDeElementos:valor; } </style> </head> |
CSS Directas
Las CSS directas se usan para poder aplicar un estilo a una parte del texto concreta. Para ello debemos utilizar el parámetro “style”. Observa el siguiente código de ejemplo:
| <X style= “atributo1:valor1;atributo2:valor2;”>Aquí va el texto al que se le aplicará el estilo</style> |
“X” sería la etiqueta html a la que se le ha aplicado el estilo, mediante el parámetro “style”. “X” puede ser un párrafo (<p>), una capa con salto de línea (<div>), una capa sin efecto (<span>), etc.
También apreciamos que el estilo está definido por unos atributos con un valor (“atributo1:valor1”), separados entre ellos por punto y coma.
Gracias al siguiente código lo comprenderemos mucho mejor:
| El texto que veremos a continuación <span style="font-size:23px;color:#0000FF">estará en azul y en un tamaño más grande</span> gracias a la css directa que hemos aplicado sobre él. |
CSS indirectas fuera del documento
Otra forma de aplicar CSS es a través de unos estilos que se encuentran fuera del documento, pero al que se aplicarán esos estilos. Esta forma de aplicar CSS es útil si queremos aplicar los mismos estilos a diferentes documentos html.
Deberemos crear por tanto un documento de extensión .css donde estarán determinados los diferentes estilos. Y desde cada hoja en la que queramos aplicarlos, habrá que indicar que debe buscar los estilos en ese documento. Para ello, debemos incluir la siguiente etiqueta con los siguientes atributos:
| <link rel="stylesheet" type="text/css" href="urlhojadeestilos.css"> |
No hay comentarios:
Publicar un comentario