Lliçó sobre HTML. La fusió de cèl·lules

Les taules al HTML - un element molt pràctic. Amb ells es pot fer res. Per descomptat, l'objectiu principal - la col·locació d'informació en una taula. Però els desenvolupadors de llocs han anat més lluny. Hi va haver un temps en què era molt popular l'ús d'una taula per crear un marc lloc. Ara els professionals estan tractant de no fer-ho.

Taules han trobat la seva àmplia aplicació causa de la gran quantitat d'atributs. Per exemple, una propietat molt útil resultar la combinació de files o columnes.

Introducció a la Teoria

En HTML, la unió de les cèl·lules es produeix per mitjà de dos atributs: colspan i rowspan. S'especifiquen per a l'etiqueta td.

Analitzem en primer lloc l'estructura de cada taula, abans d'aprofundir en el tema. A cada taula hi ha una línia, i en ella - cel·lular. Recordeu que al principi, totes les taules han de contenir el mateix nombre de cèl·lules.

La figura de dalt indicades dues files i en cada un de tres cèl·lules. Es tracta d'una taula comuna. Si es troba en alguna caixa de text, escriviu un nombre menor de cèl·lules, la taula es "mogui cap a fora", no tot es mostraran correctament.

HTML-Table: fusionar cèl·lules vertical i horitzontalment

Per especificar un nombre menor de cèl·lules o cadenes pot utilitzar només si té alguna cosa per fusionar. Però en lloc de l'element eliminat en el veí més proper a la part superior, ha d'especificar un atribut addicional. Si es combinen les columnes, llavors el colspan, si les cadenes, llavors rowspan. El valor d'un atribut indica el nombre d'objectes que voleu combinar.

Recordeu que cal especificar en l'element més proper a la part superior. Per exemple, a la figura anterior, si voleu combinar la cel 1 i 2, cal especificar en l'atribut colspan cel·lular 1 amb un valor de dos. I eliminar el número de la posició 2 o 3, no importa.

La conclusió és que li digui a la cel la quantitat d'espai que es necessita. El valor per omissió és 1.

Combinar cel·les verticalment HTML-taula es porta a terme en el mateix principi. Simplement espai ocupat serà considerat com verticalment. Vegeu la següent figura.

En aquest cas, la cel·la amb el número 43 porta dues cadenes. Per a això, s'especifica l'atribut rowspan. Acabo d'acordar:

• Fila - fila.
• Col - columna / columna.
• Span - Associació.

Els creadors han tractat de portar el llenguatge com sigui possible per a l'ésser humà, de manera que fins i tot sense saber-ho, d'alguna manera podria entendre.

En HTML, la unió de les cèl·lules pot fer-se en dues direccions: vertical i horitzontalment. Per a això, s'especifica tant atribut.

La figura anterior és només això i va declarar que l'associació pot fer: files, columnes o files i columnes.

HTML: combinar cel·les. exemples

Considerem més complex fita exemples de taules de grans dimensions. A baix, a l'esquerra Establir la versió original d'una taula normal. A la dreta - una variant amb una combinació de dues cel·les en la segona fila. Per tant més clar i més fàcil de comparar el codi HTML.

També es poden combinar els tres al centre de la cèl·lula. En el primer cas atribut colspan especifica la cel №1. Aquí, el primer serà sense canvis, i el segon afegit a la colspan, igual a tres.

Si voleu combinar totes les cel d'una fila a una sola, a continuació, treure els quatre td en el primer indiquen colspan = '5'.

Com es pot veure, de fet, tot és senzill. Res complicat. El més important, amb compte, des de la primera vegada que entendre tots els esculls de les taules, i després no haurien de sorgir problemes.

Taula de marc lloc

En HTML, la unió de les cèl·lules no s'utilitza sempre per a les taules periòdiques amb la informació (en Word o Excel). dissenyadors de llocs web sovint, però abans que les urnes els han utilitzat per al disseny de llocs.

Per exemple, consideri el disseny del lloc. Aquest disseny - molt simple i primitiu. Però es pot mostrar l'ús de l'associació de manera explícita.

Originalment hi havia una taula de tres files de dues cel·les cadascun. A continuació, posar el logo del lloc, s'han combinat els dos cel·les de la primera fila. La conclusió és que facin el mateix per acomodar el "soterrani".

A causa del seu lloc, és possible col·locar elements de disseny, i res no deixarà els seus límits. Aquest és un molt còmode i senzill. Per tant, era tan popular. Ara, es recomana crear una etiqueta div blocs.

conclusió

I recorda que la fusió cel·lular taula HTML, pot fer el que vulgui. Tot depèn del que vol i com vol organitzar. És important destacar que no es confongui. Per crear una taula gran amb un gran nombre d'associacions, es recomana dibuixar tot en un full de paper o en la pintura. Imposer principiants serà més fàcil.

Quan guanyen experiència, aquestes operacions es poden realitzar al cap fàcilment.