Les taules HTML són fàcils de crear una vegada que enteneu els conceptes bàsics de les files i les columnes, i també quan enteneu quan està bé utilitzar una taula i quan haureu d'evitar-les.
Una breu història de taules i disseny web
Fa molts anys, abans de l'acceptable CSS i estàndards web, els dissenyadors web utilitzaven l'element HTML
per crear el disseny de pàgines per als llocs. Els dissenys de llocs web serien "tallats" en petites peces com un trencaclosques i després es combinaran amb una taula HTML que es mostrarà al navegador tal com es vol. Va ser un procés molt complex que va crear molts elements HTML addicionals i que mai no serien utilitzables avui en el món de la pantalla múltiple en què visquin els nostres llocs web . Com que CSS es va convertir en el mètode acceptat per a visualització i disseny de pàgines web, l'ús de taules per a això es va rebutjar i molts dissenyadors eren per error que "les taules eren dolentes". Això va ser i és fals. Les taules per al disseny són dolentes, però encara tenen un lloc en disseny web i HTML, és a dir, per mostrar dades tabulars com un calendari d'horaris de trens. Per a aquest contingut, l'ús d'una taula continua sent un enfocament acceptable i bo.
Llavors, com es dibuixa una taula? Comencem creant una taula simple de 2x2. Això tindrà 2 columnes (aquests són els blocs verticals) i 2 files (els blocs horitzontals). Després d'haver construït una taula de 2x2, podeu crear qualsevol taula de mida que vulgueu simplement afegint files o columnes addicionals.
Dificultat: mitjana
Temps necessari: 10 minuts
A continuació s'explica com:
- Primer obriu la taula
- Obriu la primera fila amb l'etiqueta tr
- Obriu la primera columna amb l'etiqueta td
- Escriure el contingut de la cel·la
- Tanqueu la primera cel·la i obriu la segona
- Escriure el contingut de la segona cel·la
- Tanqueu la segona cel·la i tanqueu la fila
- Escriu la segona fila exactament com la primera
| | - A continuació, tanqueu la taula
També podeu optar per afegir encapçalaments de taula a la vostra taula utilitzant l'element | . Aquests encapçalaments de la taula substituiran les peces de la "taula de dades" a la primera fila de la taula, així:
| Name | Paper | | Jeremy | Designer < td> Jennifer | Desenvolupador | Quan aquesta pàgina es mostri al navegador, aquesta primera fila amb els encapçalaments de la taula, de manera predeterminada, es mostrarà en negreta i es centraran a la cel·la de la taula en què apareixen.
Per tant, és correcte utilitzar taules en HTML? Sí - sempre que no els utilitzeu per a finalitats de disseny. Si necessiteu mostrar informació tabular, una taula és la manera de fer-ho. De fet, evitar una taula a causa d'una puresa equivocada per evitar que aquest element legitmate HTML sigui tan retroactiu com utilitzar-los per motius de disseny en aquest dia i edat.
Escrit per Jennifer Kyrin. Editat per Jeremy Girard el 11/8/16
| | |