Pasos para construir una tabla HTML 2×2

Pasos para construir una tabla HTML 2×2

Pasos para construir una tabla HTML 2×2

VALORACIÓN DEL ARTÍCULO:
5/5

Las tablas HTML son fáciles de crear una vez que entienda los conceptos básicos de filas y columnas, y también una vez que entienda cuándo está bien usar una tabla y cuándo debe evitarlas.

Breve historia de las tablas y el diseño web

Hace muchos años, antes de la aceptación de los estándares CSS y web, los diseñadores web utilizaban el elemento HTML para crear un diseño de página para los sitios. Los diseños de sitios web se «rebanaban» en pequeñas piezas como un rompecabezas y luego se combinaban con una tabla HTML para que se renderizaran en el navegador como se pretendía. Fue un proceso muy complejo que creó muchas marcas HTML adicionales y que hoy en día nunca se podrían utilizar en el mundo multipantalla en el que viven nuestros sitios web. A medida que el CSS se convirtió en el método aceptado para los visuales y el diseño de la página web, el uso de tablas para esto fue rechazado y muchos diseñadores web creyeron erróneamente que «las tablas eran malas». Eso era y es falso. Las tablas para el diseño son malas, pero todavía tienen un lugar en el diseño web y HTML, es decir, para mostrar datos tabulares como un calendario o un horario de trenes. Para ese contenido, el uso de una tabla sigue siendo un enfoque aceptable y bueno.

Entonces, ¿cómo se diseña una mesa? Comencemos por crear una tabla 2×2 simple. Esto tendrá 2 columnas (estos son los bloques verticales) y 2 filas (los bloques horizontales). Después de haber construido una tabla 2×2, puede construir cualquier tamaño de tabla que desee, simplemente añadiendo filas o columnas adicionales.

Aquí está el cómo

  1. Primero abra la tabla

  2. Abrir la primera fila con la etiqueta tr

  3. Abrir la primera columna con la etiqueta td

  4. Escribir el contenido de la celda

  5. Cerrar la primera celda y abrir la segunda

    / i>

  6. Escribir el contenido de la segunda celda

  7. Cerrar la segunda celda y cerrar la fila

    / i>

  8. Escriba la segunda fila exactamente como la primera

     td>  

    Luego cierre la tabla

  9. ¡Eso es todo!

También puede elegir añadir cabeceras de tabla a su tabla usando el comando

elemento. Estas cabeceras de tabla reemplazarían a las piezas de "datos de tabla" de la primera fila de la tabla, así:

 #fefefe">#fefefe">#fefefe Name} DIFUNDE LA PALABRA-  / i>  #fefefe">#fefefe DIFUNDE LA PALABRA- DIFUNDE LA PALABRA-  / i>  #fefefe">#fefefe  / i>    

Cuando esta página se renderiza en el navegador, esa primera fila con las cabeceras de la tabla se muestra, por defecto, en negrita y se centran en la celda de la tabla en la que aparecen.

Entonces, ¿está bien usar tablas en HTML?

Sí, siempre y cuando no los utilice con fines de diseño, está bien utilizar tablas. Si necesita visualizar información tabular, una tabla es la forma de hacerlo. De hecho, evitar una tabla debido a una pureza equivocada para evitar este elemento HTML legítimo es tan atrasado como usarlos por razones de diseño en estos tiempos.

Escrito por Jennifer Kyrin. Editado por Jeremy Girard.

TAMBIÉN TE INTERESA

ZTE-nubia-Neo-5G

ZTE nubia Neo 5G: el móvil gaming más futurista y accesbible

ZTE presenta el nuevo ZTE nubia Neo 5G en España, bajo el lema «Mejor Gaming para Todos». Este dispositivo, dirigido al sector gamer, destaca por su combinación de potencia y rendimiento a un precio asequible, ofreciendo un procesador UNISOC T820 de hasta 2,7 GHz, una pantalla de 120Hz, conectividad 5G y hasta 18GB de RAM,

Sora

Sora, lo último de OpenAI para generar vídeos por inteligencia artificial

La IA Generativa vuelve a dar un paso más impulsada por la empresa que ha protagonizado el gran boom de esta tecnología. OpenAI acaba de dar a conocer Sora, que se presenta como la nueva solución de esta entidad para generar vídeos siguiendo las instrucciones de los usuarios. A priori, uno puede pensar que los

la-IA-estará-detrás-de-todas-nuestras-compras-online

En poco tiempo, la IA estará detrás de todas nuestras compras online…

No sería descabellado pensar que la IA estuviera detrás de todas nuestras compras online en no mucho tiempo. El sector se mueve en estos momentos para proponer soluciones a los ecommerce y el cliente final termina por dejarse guiar por un sistema que va más allá de unas simples recomendaciones. Y es que las herramientas

precio-OPPO-A18

OPPO A18, no se puede pedir más a un móvil por ese precio…

OPPO acaba de lanzar al mercado el nuevo OPPO A18, un smartphone que podrá ser nuestro por una cifra irrisoria en el sector: 139 euros. No hay truco, ese el coste de un teléfono que tiene muchos argumentos para seducir a cualquiera. Evidentemente, no es un gama premium, pero si un gama media de lo

nube-personal-BeeStation

BeeStation o cómo crear una nube personal en tu casa en un periquete

La mayoría de los usuarios de dispositivos móviles utilizan uno más servicios de cloud disponibles en el mercado para el almacenamiento de los archivos. Con la llegada de la nube, el almacenamiento de los móviles y de los equipos informáticos ha pasado a un segundo plano, de manera que ya no es tan importante cuantos