HTML como se usa.

Para crear algo en html primero hay que conocer los elementos de un codigo html.

*< a > Este es referentes a links/enlaces.
*< b > Sirve para denotar la negrita.
*< big > Sirve para poner la letra grande.
*< br > sirve para definir un salto de línea.
*< center > Sirve para centrar un texto o todo un código.
*< div > Se usa para agrupar elementos y darle un formato con Style (los estilos)
*< font > Se usa para especificar el estilo de texto (tamaño, fuente, color)
*< hr > Sirve para crear una línea horizontal divisoria en la página.
*< i > Sirve para poner el texto en cursiva.
*< img > Referente a las imágenes, es decir: con su link o enlace.
*< s > y < strike > Sirve para definir un tachado.
*< Small > Sirve para poner la letra pequeña.
*< table > Ee utiliza para crear tablas, junto con < tr >, < td > y < th >
*< u > Sirve para añadir un subrayado al texto.

Con estos elementos base ya es un poco mas sencillo aprender a usar el codigo html, lo mas sencillo es hacer graficos simples como una firma en lo que poco a poco aprendes a conocer los elementos del HTML.

Ejemplo de uso del como sabran y el nombre lo dice es imagen:

Código:

<center>
<link href="http://fonts.googleapis.com/css?family=Dawning+of+a+New+Day" rel="stylesheet" type="text/css"><div style="font-family: dawning of a new day; font-size: 30px;">[color=#B40404]Don't close your heart[/color]</div><div style="text-transform: lowercase; font-family: arial; font-size: 9px; letter-spacing: 1px; line-height: 8px;">♥ Because... I belive in you... I believe in us... ♥</div><div style="background-image: url('http://i.imgur.com/uZXPqOg.png'); width: 500px; height: 250px; border-radius: 0px 0px 100px 100px; "></div></center>

Que significa todo eso? Bueno aquí el desglose:

*< -center- >< / -center- > Este como su nombre lo indica es para colocar la posición del elemento que estamis por crear.
*< -  - > como se dijo antes  se usa para agrupar elementos  y darles el diseño con estilos, como se puede ver:
Seguido de un link que nos indicara de donde se jalara el tipo de la letra que se usara.

Código:

<link href="http://fonts.googleapis.com/css?family=Dawning+of+a+New+Day" rel="stylesheet" type="text/css"><div style="font-family: dawning of a new day; font-size: 30px;">[color=#B40404]Don't close your heart[/color]</div>

En esta parte se procede a colocar un texto y como veran solo es un formato para el texto como el font-family que es el tipo de letra {que ya señalamos anteriormente de donde se jalaria},font-size que es el tamaño que llevara el texto y el color del texto.

Código:

<div style="text-transform: lowercase; font-family: arial; font-size: 9px; letter-spacing: 1px; line-height: 8px;">♥ Because... I belive in you... I believe in us... ♥</div>

En esta parte se procede a colocar un texto alternativo y como veran solo es un formato para el texto como el font-size que es el tamaño de la letra, font-family que es el tipo de letra, seguido por el espacio entre letras, el color del texto y el texto.

Si se percatan todos los formatos deben terminar con:

Código:

</div>

Código:

<div style="background-image: url('http://i.imgur.com/uZXPqOg.png'); width: 500px; height: 250px; border-radius: 0px 0px 100px 100px; "></div>

En esta parte es cuando procederemos a colocar la imagen que estara en nuestra firma y como se daran cuenta no es tan complicado solo colocando background-image:url (link de la imagen entre '-' apostrofes), el tamaño de la firma en general en este caso es de 500px de anchura y 250 px de altura, si se dan cuenta no hay pierde en eso y podemos dejarlo hasta ahí, pero en este caso le daremos un formato a la imagen y eso sera redondear las orillas y eso se hace cuando colocamos border-radius entendiendo que las dos primeras medidas {0px 0px} en este caso las tengo en 0 px son las puntas superiores y las dos segundas {100px 100px} son las esquinas inferiores, esto se puede modificar a su gusto claro y cada quien los armara como mas le guste, en mi caso así seran. Y es así como se puede hacer una firma con HTML de manera sencilla.

Ir experimentando es lo que les dará la experiencia e iran creando cosas unicas y diferentes, todo esta en usar la imaginacion.

Don't close your heart

♥ Because... I belive in you... I believe in us... ♥

Código:

<div style="background-image: url(IMAGEN)"></div>

Base de la imagen

Código:

<div style="background-image: url(link); width: 000px; height: 000px; margin: 0 auto"></div>

Colocando las medidas para la imagen es necesario o no saldra nada quedando así:

Código:

<div style="background-image: url(link); width: 000px; height: 000px; margin: 0 auto; border-radius: AApx AApx aapx aapx"></div>

Aqui colocamos el formato de los bordes quedando así, en este caso  las dos primeras medidas son los bordes superiores y las dos segundas son los bordes inferiores.

Código:

<div style="background-image: url(link); width: 000px; height: 000px; margin: 0 auto; border-radius: AApx AApx aapx aapx; border-bottom: solid Xpx #XXXXXX"></div>

Con esto colocamos un extra como un bordo de color colocando el ancho y el color quedando así:

Código:

<div style="width:415px;margin:0 auto;font-size:9px;position:relative;top:-16px;text-align:center;line-height:100%">FRASE LARGA</div>

Con esto colocaremos un texto

FRASE LARGA

Si queremos darle otro toque distinto podemos colocar un doble texto, como hacemos esto? bueno podemos colocar un codigo de texto antes de la firma...

Código:

<center><div style="margin:0 auto; font-size:30px; font-family:Brush Script MT;position:relative;top:15px;color:#BF3030">FRASE CORTA</div><br><div style="background-image: url(http://i.imgur.com/uZXPqOg.png); width: 500px; height: 250px; margin: 0 auto; border-radius: 150px 150px 000px 000px; border-bottom: solid 9px #A60000"></div><br><div style="width:415px;margin:0 auto;font-size:9px;position:relative;top:-16px;text-align:center;line-height:100%">FRASE LARGA</div</center>

Cambiando el tipo de letra, el tamaño, el color, etc... Quedando algo así:

FRASE CORTA

FRASE LARGA

Rei Uchiha

Esta fue una breve explicación de como crear firmas con HTML

Y así es como se haría una sencilla firma con HTML, ya con eso se puede ir experimentando.