Sábado, 12 de Noviembre de 2024

Introducción
Herramientas
Tags (órdenes)
Estructura básica

Texto
Texto simple
Formato
Tamaño
Color
Alineación

Imagen y Enlace
Inserción de imágenes
Inserción de enlaces

Tablas
Estructura
Contorno y márgen
Color
Combinar celdas
Ajuste de tamaño
Tamaño relativo
Alineación

Formularios
Utilidad
campo de texto
Área de texto
Menú desplegable
Casilla verificación


HTML > Tablas > Contorno y márgen


En el ejemplo anterior, hemos creado una primera tabla pero es posible que no podamos ver las líneas de división entre celdas, ya que dependiendo del navegador que utilice la persona que vea la página, estas líneas pueden, por defecto, aparecer o no

Si queremos controlar el grosor de las líneas de división de nuestra tabla, debemos añadir al comando TABLE el parámetro BORDER, al cual si le damos el valor "0" haremos que las líneas de división sean invisible, y para cualquier otro valor (1, 2, 3, 4, ..) ese será el grosor de la línea en pixels.

Probaremos a poner el ejemplo anterior con un contorno de "5":

<TABLE BORDER=5>
   <TR>
      <TD>
         Primera celda de primera línea.
      </TD>
      <TD>
         Segunda celda de primera línea.
      </TD>
   </TR>
   <TR>
      <TD>
         Primera celda de segunda línea.
      </TD>
      <TD>
         Segunda celda de segunda línea.
      </TD>
   </TR>
</TABLE>


Al remarcar las líneas de contorno podemos ver que la tabla realmente es un cuardado, con cuadrados dentro (que son las celdas), y que entre las lineas de unos y otros hay una pequeña separación, y tambiñén la hay desde los contornos de las celdas hasta el contenido de ellas.

Estas separaciones también se pueden graduar añadiendo a TABLE los parámetros CELLPADDING y CELLSPACING:

     - Cellpadding (margen interno) es la distancia mínima que puede haber entre el contorno de la celda y el contenido de la misma, indicado en pixels.
     - Cellspacing (margen entre celdas) es la distancia fija que se mantendrá entre los contornos de dos celdas, y entre el contorno de una celda y el del marco de la tabla, indicado en pixels.

Ejemplos:

Por defecto Cellpadding=0
Cellspacing=8
Cellpadding=8
Cellspacing=8
Cellpadding=0
Cellspacing=0