Cómo hacer un catálogo de productos con HTML

Las tablas proporcionan el método más simple para crear un catálogo en línea en HTML. Una tabla de tres columnas le da espacio para la imagen del producto, la descripción y la información de envío/pedido. Insertar información en las tablas reduce la cantidad de tiempo necesario para justificar el texto. Además, las tablas le permiten controlar el espacio en blanco que rodea la información de su página para mejorar la apariencia y la claridad de su sitio web.

Paso 1

Defina una tabla con un borde de un píxel usando la etiqueta de apertura

:

Paso 2

Inserta la primera fila de celdas y su contenido con este código:

Esta es una descripción del primer elemento. Este artículo está disponible actualmente.

Paso 3

Inserta la segunda fila de celdas y su contenido con este código:

Esta es una descripción del segundo elemento. Este artículo está pendiente.

Paso 4

Cierra la tabla con la etiqueta final:

Consejo

Este ejemplo simple produce una tabla con dos filas y tres columnas. La primera columna muestra una imagen de 60 por 60 píxeles del producto que usa la etiqueta. La segunda y tercera columnas muestran la descripción del producto y la información de existencias. Tenga en cuenta que cada fila comienza y termina con

y cada elemento de la fila comienza y termina con una etiqueta . Inserta tantas columnas o filas como necesites para describir tu producto.

Inserte el comando cellpadding inmediatamente después de la especificación del borde en la definición de la tabla para aumentar la cantidad de espacio en blanco entre los bordes de la tabla y su contenido. Por ejemplo,

crea un espacio en blanco de 10 píxeles alrededor del contenido de cada celda de la tabla.