Integrando CSS en tu Pagina HTML

Ahora que ya sabes como escribir un poco de CSS, te enseñare como integrarlo en tu pagina HTML. Para empezar, debemos saber como y donde poner los códigos de CSS. Hay dos formas de hacerlo, la primera es ponerlos dentro de tu pagina HTML y la otras es crear un archivo con la extensión .css enlazado en tu pagina HTML.

Usando CSS dentro del HTML

Para empezar, personalizaremos las etiquetas <h2> y el fondo de la pagina:

Como puedes ver es simple, le acabamos de asignar un color anaranjado, y también le bajamos un poco el margen a la etiqueta <h2>. También asignamos que la pagina sea negra de fondo. Ese código lo pones dentro de la etiqueta <head></head> para mas orden, pero puedes ponerlo también en la sección de cuerpo <body> en tu pagina. Entonces cuando escribimos la etiqueta <h2> en cualquier parte de la pagina, nuestra pagina ensañara nuestro titulo a nuestro gusto.

Prueba… Notas el cambio?

Interesante: Este formato es usado o se usaba en las pagina sociales como MySpace o Hi5, y puede ser usado donde es permitido el ingreso de cogido de HTML.

Usando CSS enlazado

Abre tu editor de texto, cualquiera que tengas, y crea un archivo que se llame “estilo.css”. Pon ahí la misma especificaciones para la pagina como hicimos arriba (linea 2 y 3). Salva el archivo en el mismo directorio donde se encuentra tu pagina HTML.

Importante: Aquí no tienes o puedes poner las etiquetas <style></style> o otra etiqueta de HTML.

Eso es todo, con lo del archivo “estilo.css”. Regresa a tu pagina HTML. Ahora lo tenemos que llamar o enlazar a nuestra pagina HTML, por medio de la etiqueta <link>. Esta etiqueta es puesta adentro de la etiqueta <head>. Los resultados serán los mismos.

Usando CSS dentro de cada etiqueta

La ultima forma de como incorporar un estilo en HTML se hace usando la propiedad de style que casi todos las etiquetas poseen. Ejemplo:

Conclusión

Bueno, ahora ya sabes como implementar codigo CSS en tus paginas web. Como te das cuenta esto te puede ahorrar mucho tiempo y código cuando haces una pagina web. Recuerda que cuando asignas algún estilo de tu gusto a cualquier etiqueta todas esas etiquetas saldrán con el nuevo estilo asignado.

En el siguiente tema sobre CSS, miraremos Classes y IDs…

[icon:user]ABCO
[icon:tag],
notice

No Trackbacks

No hay trackbacks todavia, sea el primero, Copie el enlace de arriba.
notice

No comments

No hay comentarios todavia, pero tu puedes dejar tu comentario
add comment

Deje su comentario