¿Qué podemos crear en nuestra página web? Parte 3

Edición de nuestra página web (Parte 3)

Cada vez queda menos para que se acabe esta guía sobre las etiquetas y el lenguaje html, y también se va complicado cada vez mas, pero lo intentaré poner de la forma mas fácil y resumida de entender.

En esta entrada explicaré como alinear imágenes y como insertar y editar tablas, disfrútenlo!

Alineación de las imágenes:

Para alinear la imagen a la derecha se utiliza la etiqueta:

                                     

                                     <IMG SRC="imagen.gif" ALIGN=RIGHT>

Para alinear la imagen a la izquierda se utiliza la etiqueta:

<IMG SRC="imagen.gif" ALIGN=LEFT>

Si se quiere interrumpir el proceso de rellenado del texto a los lados de la imagen, para que salte hasta debajo de ella, es decir, dejar un espacio en blanco, se pueden emplear las sigueintes versiones de la etiqueta con <BR>:

<BR CLEAR=LEFT> Busca el primer margen libre a la izquierda.

<BR CLEAR=RIGHT> Busca el primer margen libre a la derecha.

<BR CLEAR=ALL> Busca el primer margen libre a ambos lados.

Tablas:

1. La etiqueta general, que engloba a todas las demás es <TABLE> y </TABLE>. Es decir:<TABLE>
   </TABLE>
   
2. En el siguiente nivel, dentro de la anterior, están las etiquetas para formar cada fila de la tabla, que son <TR> y </TR>. Hay que repetirlas tantas veces como filas queremos que tenga la tabla. 
3. En el último nivel (dentro de las anteriores) están las etiquetas de cada celda, que son <TD> y </TD>, que engloban el contenido de cada celda concreta (texto, imágenes, etc.). Se deben repetir tantas veces como celdas queremos que haya en esa fila

Se puede añadir un título a la tabla. Se consigue con la etiqueta <CAPTION> y </CAPTION>.
Si en el ejemplo anterior añadimos la siguiente línea:

Este es un ejemplo de las tablas que he realizado yo:

<TABLE BORDER>
<TR> 
<TH>Consolas</TH> <TH>Compañías</TH> <TH>Vendidas en 2019</TH>
</TR>
<TR>
<TD>playstation</TD> <TD>Sony</TD> <TD></TD>
</TR>
<TR>
<TD>fila2-celda1</TD> <TD>fila2-celda2</TD> <TD>fila2-celda3</TD>
</TR>
</TABLE>