Etiquetas HTML

TAG (CODIFICACIÓN EN HTML) DESCRIPCIÓN
<font color=»blue»> HOLA </Font> Establece color “azul” al texto HOLA
<hr> Añade una línea horizontal en toda la pantalla
<hr width=»80%»> Añade una línea horizontal abarcando el 80% de la pantalla
<u>Texto  </u> Subraya el texto
<b>Texto  </b> Establece el texto en Negrita
<i>Texto  </i> Establece el texto en Cursiva
<br> Establece saldo de línea
<title> Mi primera pagina Web </tiltle> Título que aparece en la barra de título
<body>

</body>

Apertura y cierre del cuerpo de la página web
<body bgcolor=»#EBDCA7″>

</body>

Establece color de relleno de la ventana
<h1> Texto 1 </h1>

<h2> Texto 2 </h2>

<h3> Texto 3 </h3>

<h4> Texto 4 </h4>

<h5> Texto 5 </h5>

<h6> Texto 6 </h6>

Establece tamaño al texto desde <H1> que representa al tamaño más grande hasta <H6> tamaño más pequeño.
<p align=»center»>  Objeto

</p>

Alinea el Párrafo: Center: Centrado, Left: Izquierda, Right: Derecha, Top: Arriba
<div align=»center»> objeto

</div>

Alinea el Objeto: Center: Centrado, Left: Izquierda, Right: Derecha, Top: Arriba
<img src=»imagenes/caritatriste.jpg» 

width=200 height=200 

border=3 

align=left

alt=»HOLA ESTOY FELIZ»>

Inserta una Imagen, especificando la ruta de acceso.

Establece el ancho de la imagen: width: Ancho, height: Alto.

Ancho del borde del objeto de imagen.

Alinea la imagen a  una posición determinada.

Texto alternativo. Se visualiza al colocar el puntero sobre la imagen.

<blockquote>Texto

</blockquote>

Establece sangría al texto (tabulaciones)
<pre>

Texto 1

Texto 2

Texto 3

</pre>

Muestra el texto tal como lo escribimos, considerando salto de línea y tabulación automático.
&nbsp; Separa las palabras del texto con un espacio en blanco.
<center> Texto </center> Centra un objeto.
<ul>

<li> Texto1 </li>

<li> Texto2 </li>

</ul>

Lista desordenada.

Establece la lista en viñetas.

<ol>

<li> Texto1 </li>

<li> Texto2 </li>

<li> Texto3 </li>

</ol>

Lista ordenada.

Establece la lista con numeración.

<font size=+3> Texto

</font>

Establece tamaño al texto.
<a href=»http://www.hotmail.com»> Texto

</a>

Crea hipervínculo a un texto determinado, considerando la dirección URL de la página web.
TRABAJO CON TABLAS
<table align=»center» border=»5″ >

  <caption> Texto título</caption>

   <th>Columna 1</th> <th>Columna 2</th> 

   <tr>

  <td>fila1-columna1</td> 

   </tr>

</table>

Inserta una tabla, especifica la Alineación y Estilo de Borde.

Título de la Tabla.

Texto de cabecera de  columnas (Texto resaltado y centrado)

Especifica la posición de la fila

Posiciona la celda según columna

<tr>

  <td><IMG SRC=»hidra.gif» WIDTH=60 Height=150>     

  </td>

  <td> <a href=»Pagina1.html»> Texto </a>

  </td>

  <td>Un texto cualquiera</td>

</tr> 

Información que puede contener un celda:

Celda cuyo contenido es una imagen.

Celda cuyo contenido es un hipervínculo.

Celda cuyo contenido es un texto.

<table width=60%>

<table height=200>

Fuerza a la tabla a ocupar el 60% de la ventana.

Dimensiona la tabla a 200 puntos de alto.

<td align=top> Arriba </td>

<td align=bottom> Abajo </td>

Alineación en sentido Vertical (celda)
<td align=center> Al centro </td>

<td align=right> A la derecha </td>

Alineación en sentido Horizontal (celda)
<tr><td colspan=2> Texto </td></tr>

<td rowspan=2> Texto </td>

Celdas que abarcan a otras varias:

Celda sobre 2 columnas.

Celda junto a 2 filas.

<table border bgcolor=»#00FF00″>

<td bgcolor=»#FF0000″>

Color de fondo en tablas y celdas.
<table border background=»nubes.jpg»>

<td background=»nubes.jpg>

Imágenes de fondo en tablas y celdas.
<table border cellspacing=20> Separación entre las celdas.
<table border cellpadding=20> Separación entre el borde y el contenido de las celdas.

Deja un comentario

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies ACEPTAR

Aviso de cookies