Está en la página 1de 3

Crea tu pgina web ya!

Ttulo de tu pgina web : Tu e-mail :


T u e- mail es obligatorio pues nos permitir enviarte tu c ontras ea.

Buscar

Inicio > C urso de e stilos C SS > Sintax is y propie dade s de los e stilos C SS

Anuncios Google

Font CSS CSS in HTML Curso CSS

Sintaxis y propiedades de los estilos CSS


Por: Lucas Muoz
CURSOS RELACIONADOS

Recomendar leccin:

Me gusta

Tw ittear

Crear web desde cero La sintaxis es muy simple, consiste en escribir el nombre de la etiqueta html que queremos aplicarle un estilo o bien el nombre de la capa o bloque seguido de una llave { y luego los estilos que queremos aplicar, una vez que tenemos todo el cdigo listo, cerramos la llave con } , si por ejemplo queremos cambiar el tamao de fuente de toda la pgina web, le aplicaramos el estilo a la etiqueta <body>, quedara de esta forma: body{ font-size:16px; } Cuando queremos aplicar estilos a un bloque que creamos nosotros, antes del nombre tenemos que insertar un # , imaginemos que creamos un bloque (capa) llamado c abecera donde queremos asignarle un tamao de 780px de ancho, lo hacemos as: #cabecera{ width:780px; } Recuerden que al final de cada atributo va un ; . Hasta ac vamos bien, la sintaxis bsica ya la tenemos dominada, ahora veamos las propiedades y atributos para aplicar estilos. Curso de html Como crear una pagina web con html5 y dreamweaver

Atributos y propiedades CSS


Modificar fuentes Estos son los atributos que cambian el aspecto de las fuentes: font-family: este atributo cambia el tipo de fuente, por ejemplo: font-family: verdana,sans-serif; font-size: cambia el tamao de la fuente, ej: font-size: 15px; color: con este atributo cambiamos el color de la fuente, podemos seleccionar el color mediante una palabra (red, gray, green, etc), formato RGB (rgb(255, 255, 255) o valor hexadecimal (#F4F4F4)), la sintaxis sera as: color: #fff; font-style: cambiamos el estilo de fuente, podemos elegir entre normal, oblique, italic de esta forma: font-style: italic; Modificar texto y prrafos text-align: con este atributo modificamos la alineacin del texto, podemos elegir entre left, center, right, justify de esta forma: text-align: left; text-decoration: si queremos que nuestro texto este subrayado, sobrerayado o tachado, escribimos: text-decoration: seguido de alguna de estas palabras: underline, overline, line-through y si no queremos nada escribimos none, ejemplo: text-decoration: none; Modificar el fondo background-image: le decimos al navegador que queremos una imagen de fondo, as: background-image: url(/imagenes/fond.jpg); si queremos que la imagen se repita usamos otro atributo llamado repite-x o repite-y . background-color: seleccionamos un color de fondo, de esta manera: Crear una Pagina Web

background-color: #000000; Modificar un bloque o capa Si queremos modificar una capa o bloque utilizamos estos atributos: margin: le especificamos un margen en px o em, este atributo podemos hacerlo mas especifico, por ejemplo: margin-left (margen izquierdo), margin-right (margen derecho), margin-top (margen superior), margin-bottom (margen inferior). padding: especificamos un espacio de padding, al igual que el atributo margin, podemos especificarlo aun mas, padding-left (margen izquierdo), padding-right (margen derecho), padding-top (margen superior), padding-bottom (margen inferior). border: le aplicamos un borde al bloque, podemos hacerlo as: border: 1px solid #000000; primero especificamos el tamao del borde, luego el tipo (solid, double, etc) y finalmente el color. float: como su nombre lo indica, con este atributo f lotamos el bloque, podemos elegir right, none, left, as: float: left; clear: con este atributo modificamos la alineacin de los elementos que estn a los lados, podemos elegir entre: both, none, right, left. as: clear: both; Con esto ya podrs comenzar a escribir estilos CSS y crear tu pagina web con una estructura mas ordenada y simple. En la siguiente leccin veremos como hacer que la hoja de estilos se asocie con nuestra pagina web para que los estilos se apliquen.

Tercera leccin: Asociar la hoja de estilos CSS con nuestra pagina Web Te quedaron dudas de esta leccin? Unete a la Comunidad de Webmasters y haz tu pregunta, entre todos te ayudaremos.
Escribe el ttulo de tu pregunta aqu... Enviar pregunta

Preguntas de otros usuarios en la comunidad Como posiciono mi pagina web? ayuda por favor JQuery o Mootools? ayudenme a elegir Sombras invertidas con CSS? tengo mi pagina y se me borro el public html como lo regreso a l puesto donde era con embed se oye solo en chrome y en ie, hay otro cdigo, bgsound no gracias como se hace lengujehtml y se pegando imagenes por que mi firefox mosilla no agarra bgsound y tampoco embed? Como poner 2 imagenes pero que solo se muestre una y que alla un boton para cambiar a la otra deseo crear una pagina esoterica y ganar por visitas "como lo hago"

Imprimir

Enviar por email

Favoritos

T amao de fuente

CURSO: CURSO DE ESTILOS CSS

LECCIONES RELACIONADAS

Hoja de estilos css Poner fondo con estilos css Centrar contenido con css Margen y padding con estilos css Flotar y acomodar un div Evitar que un div o capa se superponga con otra

Politica de privacidad | Publicidad | Contacto | Mapa web

También podría gustarte