El documento explica cómo insertar tablas y formato de tablas en HTML utilizando etiquetas como <table>, <tr>, <td>. Describe cómo agregar bordes, colores de borde, relleno de celda, espaciado de celda y alineación. También cubre cómo agregar imágenes usando la etiqueta <IMG> y cómo definir el ancho, alto, espacio horizontal y vertical de las imágenes.

1. HTML
TABLAS
Para insertar una tabla en una página de internet
debes incluir el código. Este puede ser
modificado para obtener diferentes resultados y
estilos de tablas.
<table border=1><td>Aqui va el contenido de la
tabla, texto, imágenes, etc.</td></table>
LICEO RODRIGO ARENAS BETANCOURT CENAIDA ALARCON

2. La etiqueta de inicio <table> y la etiqueta de
cierre </table> inician y finalizan la tabla. Lógico.
<tr> es la abreviatura de "table row" (es decir, fila de la tabla)
e inicia y finaliza las filas horizontales. Lógico también.
<td> es la abreviatura de "table data" (es decir, datos de la
tabla). Esta etiqueta inicia y finaliza cada una de las celdas
que componen las filas de la tabla. Todo sencillo y lógico.
<table>
<tr>
<td>Celda 1</td>
<td>Celda 2</td>
<tr>
<td>Celda 3</td>
<td>Celda 4</td>
</table>
LICEO RODRIGO ARENAS BETANCOURT CENAIDA ALARCON

3. <table bgcolor="blue" border="4" bordercolor="yellow" cellpadding="2"
cellspacing="2" align="center">
<tr>
<td>Celda 1</td>
<td>Celda 2</td>
<tr>
<td>Celda 3</td>
<td>Celda 4</td>
</table>
bgcolor="blue": podemos reemplazar "blue" por otro color pero atencion los colores se
reemplazan con los nombres pero en ingles.
border="4":con esto podemos definir el grosor del borde reemplazandolo siempre con un numero.
bordercolor="yellow":aca podremos modificar el color del borde segun el nombre en ingles del
color que quieras.
cellpadding="2":indica el espacio entre el borde de la celda y el contenido de la celda.
cellspacing="2":indica el espacio entre cada celda.
align="center":indica la alineacion de la tabla si es,center o right o left.
LICEO RODRIGO ARENAS BETANCOURT CENAIDA ALARCON

4. COLUMNAS
El número uno se refiere al tamaño del borde
de la tabla. Si aumentas el número el borde será
mas grueso y si escribes 0 la tabla no mostrará
borde alguno
<table border=1><td>Columna
#1</td><td>Columna #2</td></table>
LICEO RODRIGO ARENAS BETANCOURT CENAIDA ALARCON

5. IMÁGENES EN HTML
La marca <IMG> no necesita cierre y su sintaxis correcta es:
<IMG SRC="immagine.gif">
donce SRC corresponde al inglés Search y es el recorrido del que el
navegador saca la imagen (en este caso "immagine.gif"). Esta
marca es única en el sentido de que NO lleva como cierre el
correspondiente </IMG>.
LICEO RODRIGO ARENAS BETANCOURT CENAIDA ALARCON

6. WIDTH y HEIGHT
Es posible definir la anchura y la altura de la imagen gracias a los atributos
width y height, respectivamente:
<IMG SRC="immagine.gif" WIDTH=178 HEIGHT=180 ALT=“OSOS ">
donde WIDTH=178 es la dimensión horizontal (ancho) de la imagen expresada
en píxel, y HEIGHT=180 la dimensión vertical (alto).
Mediante estos atributos podemos definir dimensiones diferentes de las que
realmente tiene la imagen. En cualquier caso, es aconsejable insertar imágenes
con su tamaño efectivo sobre todo si están en formato GIF, dado que, cuando
se cambian las medidas, este formato pierde mucha calidad.
LICEO RODRIGO ARENAS BETANCOURT CENAIDA ALARCON

7. HSPACE y VSPACE
Con estos dos atributos podemos establecer la distancia en píxel de la imagen a
los objetos que se encuentran a los cuatro lados de la misma.
HSPACE define la distancia de los lados derecho e izquierdo de la imagen a los
objetos más cercanos (texto, imágenes, apliques, etc.).
VSPACE define la distancia de los lados superior e inferior de la imagen a los
objetos más cercanos (texto, imágenes, apliques, etc.). La sintaxis correcta es
<IMG SRC="immagine.gif" WIDTH=178 HEIGHT=180 BORDER=2 VSPACE=3
HSPACE=3 ALT="Obra de K. Haring">
Estos atributos resultan útiles cuando queremos distanciar la imagen de los
objetos más cercanos.
LICEO RODRIGO ARENAS BETANCOURT CENAIDA ALARCON