Truquillos html (guia para principiantes)

Estos son algunos trucos html que se pueden usar para personalizar su pagina:



Atras adelante y actualizar.



<input type="button" value="Atrás" onclick="history.back()" style="font-family: Verdana; font-size: 8 pt">

<input type="button" value="Actualizar" onclick="window.location.reload()" style="font-family: Verdana; font-size: 8 pt">

<input type="button" value="Adelante" onclick="history.forward()" style="font-family: Verdana; font-size: 8 pt">



Imprimir pagina actual:



<a href="javascript:print()">Imprimir</a>



Seleccionar todo:



<input type="button" value="Seleccionar Todo" onClick="javascript:this.form.correo.focus();this.form.correo.select();">



Texto remarcado



<span style="background-">TU TEXTO </span>



Texto de color:



<font color="#ff0000">Tu Texto de color</font>



Texto con marco:



<P STYLE="border: ridge #FF0000 2px">texto enmarcado.</P>



Listas No Ordenadas



Empezamos con la etiqueta



<ul>

y seguimos con la lista de la siguiente forma

<li>Marcas

<li>Modelos

<li>Motores

<li>Autos

y terminamos asi

</ul>



Listas Ordenadas



Empezamos con la etiqueta

<ol>

y seguimos con la lista de la siguiente forma

<li>Computadoras

<li>CPU

<li>Monitores

<li>Impresores

y terminamos asi

</ol>



A continuación detallare un breve listado de códigos que pueden ser de utilidad para la aplicación de tus textos en html:



<b>Letra en negrita</b>

<i>Letra en cursiva</i>

<u>Letra subrayada</u>

<center>Texto centrado</center>



<p align="right">Texto alineado a la derecha</p>



<p align="left">Texto alineado a la izquierda</p>



<p align="justify">Texto justificado</p>



<marquee>Texto en movimiento</marquee>



Algo común con el código HTML, es que no reconoce las tildes, las "eñes" y las dieresis (quizás debido a que este lenguaje fue concebido en el idioma inglés, donde estas reglas ortográficas no existen), sin embargo a continuación detallo los códigos para tales detalles:



á = &aacute;

é = é

í = í

ó = ó

ú = ú

ñ = ñ

Ñ = Ñ

ü = ü

Ü = Ü



Lineas:



<hr> = Linea



Si quieres líneas de colores, después del código "hr" especificas el color de línea que deseas, por ejemplo:



<hr color="red">



Si quieres controlar en grosor de la línea, después de especificar el color, especificas el grosor, por ejemplo:



<hr color="red" size=1>



Si quieres controlar el largo de la línea, después de especificar el grosor, espcificas el largo, por ejemplo:



<hr color="red" size=1 width="250">



Saltos de Linea



<br>Salto<br>Linea

Salto



Tablas

Para especificar u ordenar cierta información, nos vemos en la necesidad de usar "tablas", para ello nos auxiliaremos de los siguientes códigos:



<table border=1><td>Contenido de la tabla</td></table>



También podemos crear dos o más columnas separadas o encasilladas, por ejemplo:



<table border=1><td>Columna 1</td><td>Columna 2</td><td>Columa 3</td></table>



Si lo deseamos, podemos tener casillas bajo nuestras columnas, de esta forma:



<table border=1><td>Columna 1</td><td>Columna 2</td><td>Columna 3</td><tr><td>Casilla bajo columna1<td>Casilla bajo columna 2<td>Casilla bajo columna 3</td></table>



También podemos poner un fondo de color en nuestra tabla, cambiar el color de la letra, de la siguiente forma:



<table border=1 bordercolor="white" bgcolor="black"><td><fontcolor="white">Aqui va el texto dentro de tu tabla</font></td></table>



Aqui te explico cada etiqueta para entenderla un poco mejor:



"Table border" ó Borde de tabla, es lo que está alrededor de nuestra tabla.



"Bordercolor" ó Color de borde que deseamos alrededor de nuestra tabla (Borde de tabla).



"Bgcolor" ó Background color ó Color de Fondo de nuestra tabla.



"Fontcolor" ó Color de fuente para nuestra tabla







Como hacer "anclajes"

Algo muy util para nuestros sitios o blog, son los "anclajes".

"Anclajes", son aquellos vínculos que nos redireccionan a la misma página donde navegamos (no nos envía a otra), dependiendo, puede que nos mande al final de la página y viceversa. Seria como "saltar" en la misma página.



Esto se logra con el siguiente código:



<a href="#identificador">Aqui el link</a>



Luego nos vamos al lugar de la página donde queremos "anclar" el link anterior. Y sería:



<a name="identificador" id="identificador">Pones lo que quieras</a>



El "identificador", puedes cambiarlo por una palabra que sea de tu comodidad, y que no te confunda al momento de usarlo en tu código HTML.



Algo muy básico y que no puede faltar en nuestro sitio web o blog, son los famosos "links", por lo menos en Blogger (ó en cualquier programa editor HTML como Dreamweaver o FrontPage) tiene un boton con la forma de una cadena.



Pero, como hacerlo en HTML o inclusive en un lugar distinto de nuestro blog.

Bueno pues muy simple, nos auxiliamos de la siguiente etiqueta:



<a href=http://www.blogger.com>Haz clic aqui</a>



lo que logramos con esto es que el texto que está entre las etiquetas ("Haz clic aqui") nos haga una referencia o enlace con el sitio web que asignamos, que en el ejemplo es http://www.blogger.com



Si quieres hacer un link para tu E Mail, solo tienes que agregar la función "mailto", de la siguiente forma:



<a href=mailto:tucorreo@gmail.com >Hola</a>



lo que se logra es que la palabra "Hola", hace una referencia a tu correo electrónico.



IMPORTANTE: Si quieres hacer un link dentro de tu plantilla recuerda encerrar entre comillas (" ") la dirección del sitio, desde el "http://.............. hasta el .com"