Códigos HTML

Si queremos crear páginas webs en HTML, aquí viene un cursillo con los códigos HTML a saber:

1-Empezar la página:

Para empezar la página, siempre ponemos estos códigos:

<html>
<head>
	<title>Sin título</title>
</head>

<body>

(Escribir aquí texto y demás contenido)

En donde pone "Sín Título", escribimos lo que queramos que salga en el borde de la ventana en donde están las opciones de minimizar, aumentar y cerrar. Por ejemplo, escribimos "El Jueves - la web que sale los miércoles" y luego en la ventana de la web en el borde izquierdo superior nos saldrá:

Luego podemos cambiar los colores y poner el color del fondo y del texto tal como nos plazca. Para ello, incluiremos estos códigos:

<font color=" "> y entre las comillas ponemos el color que queramos en inglés ( yellow, red, blue, black, orange,...Si no tienes conocimientos buenos de inglés, usa un diccionario o un traductor ).

Para el tamaño de las letras, usaremos:

<font size:" "> y entre las comillas ponemos +1, +2, ... dependiendo de los puntos en que queramos que sea grande el texto. Aquí te pongo una guía sobre los tamaños:

+1 = 8; +2 = 10; +3 = 12; +4 = 14; +5 = 18; +6 = 24; +7 = 36;...

Ahora comencemos a excribir:

Cuando queramos separar el texto, ponemos al final de la última palabra de la frase pues el código <br>. Ej: La casa<br>es<br>fea y sale:

La casa

fea

Si queremos que el texto salga subrayado o en negrita o ambas cosas, ponemos:

<b>Texto<b> = Sale el texto en negrita

<u>Texto<u> = Sale el texto subrayado

<u><b>Texto<u><b> = Sale el texto en negrita y en subrayado

Cuando queramos poner un enlace a una página, ponemos:

<A HREF="http://Dirección de la Página">Texto que aparecerá en el enlace"</A>

Cuando queramos poner una imagen en la página, ponemos:

Y si queremos ponerla con un hipervínculo ( un enlace a una página web ):

Si queremos crear una tabla ponemos:

<TR> = Indica que aquí comienza una fila

<td>Texto</td> = Indica que aquí hay una columna con un texto opcional

Cuando queramos que acabe la fila, volvemos a poner al final <TR> y debajo </Table>

Ej:

<table border="1" witdh="100%">
<TR> 
    <td>Texto</td>
    <td>Texto</td>
    <td>Texto</td>
</TR>
<TR>
    <td>Texto</td>
    <td>Texto</td>
    <td>Texto</td>
</TR>
</Table>

y sale una tabla de tres columnas con tres filas cada una y con la palabra "Texto" escrita.

Si queremos poner una imagen a un tamaño diferente, ponemos:

img src="Dirección en donde está la imagen" WIDTH="tamaño de ancho" HEIGHT="tamaño de altura">

Si queremos ponerlo en medio o a la izquierda o derecha de la página esa imagen, ponemos:

Si quieres que un texto vaya rebotando desde la parte izquierda y la derecha pues incluye:

<marquee behavior='alternate'>TEXTO</marquee>

Y si quieres que vaya de derecha a izquierda sin rebotar:

<marquee>TEXTO</marquee>

Si quieres escribir un texto que parpadee como una alarma, ponemos:

Cuando queramos finalizar la página, escribimos al final de todo estos códigos:

</body>
</html>

Cosas Opcionales

A medida que fui creando webs, compañeros/as de trabajo me pasaron varios códigos HTML para cosas curiosas que si quereis, podeis tenerlo para añadirlos en vuestra web para hacerla mas chula.

1-Euroconversor: Pues eso, una minicalculadora para pasar de pesetas a euros y viceversa:

2-Código AntiCopia: Sirve para que los internautas no cojan cosillas de tu web jeje:

3-Aviso de actualización: Sirve para poner la fecha de la última actualización en la web:

4-Envío de SMS: Sirve para poder enviar SMS a móviles:

5-Texto en el ratón: Sirve para poner un texto en el ratón y cuando lo mueves, se mueve ese texto también:

<font size=4 color="#FFFFFF" face="ransompaste"><script language="JavaScript">i=10;function mover(){if (i<=500){i=i+1;}document.all'planetLayer'].style.left=i+10;document.planet.width=i-275;setTimeout('mover()',10);}function otra(){i=100;}</script><DIV ID="planetLayer" STYLE="position: absolute; left: 325px; top: 200px; width: 0px; height: 0px; z-index: 2 "><br><BORDER="U" onmouseover="mover()"><br></DIV><br><script>mover();</script><div id="dot0" style="position: absolute; visibility: hidden; height: 20; width: 20;"></div><br>
<br />
<div id="dot1" style="position: absolute; height: 18; width: 18;">U</div><br><div id="dot2" style="position: absolute; height: 16; width: 16;">N</div><br><div id="dot3" style="position: absolute; height: 14; width: 14;">E</div>
<br />
<div id="dot4" style="position: absolute; height: 12; width: 12;">T</div><br><div id="dot5" style="position: absolute; height: 9; width: 9;">E</div><br><div id="dot6" style="position: absolute; height: 6; width: 6;"></div><script src="http://www.arrakis.es/~atamayo/movrat.js"></script>

6-Buscador: Pues eso, para poner un buscador en tu web. Aquí te incluyo el de Yahoo:

<FORM METHOD="GET" ACTION="http://es.search.yahoo.com/search/es/" target="fuera"><TABLE><TR><TD><A HREF="http://es.yahoo.com" target="fuera"><IMG SRC="http://www.yahoo.com/images/doyou.gif" ALT="[logo]" BORDER="0"></A></TD><TD><INPUT SIZE="15" NAME="p"><INPUT TYPE="SUBMIT" VALUE="Buscar"><A HREF="http://es.search.yahoo.com/search/es/options" target="fuera"><SMALL>opciones</SMALL></A></TD></TR></TABLE></FORM>

Volver a la página principal

Volver a la anterior página