Lecția pe HTML. fuzionarea celulelor

Tabelele din HTML - un element foarte la îndemână. Cu ei poți face nimic. Desigur, scopul principal - plasarea de informații într-un tabel. Dar dezvoltatorii de site-uri au mers mai departe. La un moment dat a fost foarte popular pentru a utiliza un tabel pentru a crea un cadru de site-ul. Acum profesioniști încearcă să nu facă acest lucru.

Tabelele au găsit aplicarea lor largă, din cauza numărului mare de atribute. De exemplu, o proprietate foarte utilă transformat combinarea rânduri sau coloane.

Introducere în teoria

In HTML, unirea celulelor are loc prin intermediul a două atribute: colspan și rowspan. Acestea sunt specificate pentru tag-ul TD.

Să analizăm mai întâi structura fiecărui tabel, înainte de a se îngropa în subiect. În fiecare masă există o linie, și în ea - celula. Amintiți-vă că, inițial, toate tabelele trebuie să conțină același număr de celule.

Figura de mai sus indicate două rânduri și în fiecare dintre cele trei celule. Este o masă comună. Dacă vă aflați în orice casetă, tastați un număr mai mic de celule, masa este „muta“, toate nu vor fi afișate corect.

HTML-Table: îmbina celule pe verticală și orizontală

Pentru a specifica un număr mai mic de celule sau siruri de caractere pot fi utilizate numai dacă ai ceva să fuzioneze. Dar, în loc de articol șters în cel mai apropiat vecin la partea de sus trebuie să specificați un atribut suplimentar. Dacă combinați coloanele, apoi colspan, în cazul în care siruri de caractere, apoi rowspan. Valoarea unui atribut indică numărul de elemente pe care doriți să le îmbinați.

Vă rugăm să rețineți că trebuie să specificați acest lucru în cel mai apropiat element de la început. De exemplu, în figura de mai sus, dacă doriți să combinați celula 1 și 2, trebuie să specificați în atributul colspan de celule 1, cu o valoare de două. Și ștergeți numărul poziția 2 sau 3, nu contează.

Linia de jos este că vă spun celula cât de mult spațiu va dura. Valoarea implicită este 1.

Îmbinați celulele pe verticală HTML tabel are loc pe același principiu. Pur și simplu spațiu ocupat va fi considerată ca fiind verticală. A se vedea figura de mai jos.

Aici, celula cu numărul 43 are două șiruri. Pentru a face acest lucru, specificați atributul rowspan. Doar amintit:

• Rând - rând.
• Col - coloana / coloană.
• Span - Asociația.

Creatorii au încercat să aducă limba în care este posibil pentru om, astfel încât chiar și fără să știe, ar putea înțelege într-un fel.

In HTML, unirea celulelor se poate face în două direcții: pe verticală și orizontală. Pentru a face acest lucru, vom specifica ambele atribute.

Cifra de mai sus este doar faptul că și a declarat că asociația poate face: rânduri, coloane sau ambele rânduri și coloane.

HTML: celule de îmbinare. exemple

Să luăm în considerare mai multe exemple complexe piatră de hotar pe mese mari. Mai jos pe stânga Setați versiunea originală a unui tabel obișnuit. Un drept - o variantă cu o combinație de două celule, în al doilea rând. Deci, mai clar și mai ușor de a compara codul HTML.

Puteți combina, de asemenea, trei în centrul celulei. În primul caz, atributul colspan specifica celula №1. Aici, primul va fi neschimbat, iar a doua adăugat la colspan, egal cu trei.

Dacă doriți să îmbinați toate celulele într-un rând la un singur, apoi scoateți cele patru TD, în primul colspan = indica „5“.

După cum se poate vedea, de fapt, totul este simplu. Nimic complicat. Cel mai important, cu atenție, de la prima dată pentru a înțelege toate capcanele tabelelor, iar atunci nu ar trebui să apară probleme.

Tabelul ca un cadru sit

In HTML, unirea celulelor nu este întotdeauna folosit pentru mese regulate cu informații (în Word sau Excel). designeri site-ul de multe ori, dar înainte de vot le-au folosit pentru aspectul site-uri.

De exemplu, ia în considerare aspectul site-ului. Acest design - foarte simplu si primitiv. Dar vă poate arăta utilizarea de asociere în mod explicit.

Nu a fost inițial un tabel cu trei rânduri de două celule fiecare. Apoi, pentru a plasa logo-ul site-ului, cele două celule în primul rând au fost combinate. Linia de jos este de a face același lucru pentru a se potrivi „subsol“.

Datorită locul său, este posibil de a plasa elemente de design, și nimic nu va părăsi limitele sale. Acesta este un foarte comod si simplu. Prin urmare, a fost atât de popular. Acum, este recomandat pentru a crea un tag blocuri div.

concluzie

Și amintiți-vă că fuzionarea unei celule de tabel HTML, poți să faci ce vrei. Totul depinde de ceea ce doriți și cum doriți să-l aranjeze. Foarte important, nu te confuz. Dacă doriți să creați o masă mare, cu un număr mare de asociații, este recomandat să-l tragă totul pe o bucată de hârtie sau în vopsea. începători Imposer va fi mai ușor.

Atunci când experiența câștig, aceste operații le puteți efectua în cap cu ușurință.