Bună ziua, astăzi vom vorbi despre un atribut atât de important în CSS precum crearea unui cadru. Un chenar este foarte des folosit pentru a încadra text, pentru a separa un element de design de altul și este util pentru fiecare webmaster să știe cum să seteze un chenar în CSS.
Setați stilul chenarului în CSS.
Primul lucru pe care trebuie să-l întrebați atunci când creați un cadru pe site-ul dvs. este stilul cadrului CSS. Datorită acestui fapt, veți informa browserul ce linie va afișa cadrul. De exemplu, să setăm doar o linie continuă pentru un titlu, ca în cadrele obișnuite. Pentru a face acest lucru, desigur, avem nevoie de un fișier de stil pe care îl puteți crea singur și am descris deja cum să faceți acest lucru în alte articole de pe blogul meu.
Nu voi crea fișier nouÎl voi folosi pe cel vechi, în plus, anteturile sunt păstrate aici diferite niveluri pentru care vom crea cadre. Sa intrebam tipuri diferite cadru pentru antetul primului nivel și care este specificat de eticheta h1. Pentru a face acest lucru, scriem următorul text în fișierul de stil: h1 (border-style: solid;) și luăm în considerare pe scurt ceea ce am scris. h1 este ceea ce am determinat pentru ce element vom seta o comandă în stil border, ceea ce înseamnă că pentru a acestui element trebuie să setați un cadru cu un anumit stil, iar solidul denotă stilul de afișare al cadrului, în în acest caz, Aceasta este o linie completă.
Putem schimba stilul de afișare al cadrului și pentru asta trebuie doar să setăm noi parametri și acum voi arăta ce comenzi sunt disponibile și cum sunt afișate pe site.
Opțiuni de cadru:
solid sau linie solida.
Linie punctată-punctată.
linie întreruptă.
dublu-dublu linie continuă.
Acestea sunt principalele stiluri pe care le puteți setați stilul de chenar în CSS, puteți afla mai multe despre toate comenzile din specificația CSS.
Înainte de aceasta, setăm stilul complet pentru întregul cadru, dar putem seta și parametrul special pentru oricare dintre laturi, iar foaia de stil ne oferă această oportunitate. Patru comenzi ne vor ajuta în acest sens: border-left-style (linia stângă), border-top-style (linia de sus), border-right-style (linia dreaptă) și border-bottom-style (linia de jos).
Acum să setăm antetul nostru să aibă un stil diferit pentru fiecare parte. Să scriem o comandă pentru toate cele patru părți:
h1 (
border-left-style:groove;
border-top-style:solid;
chenar-dreapta-stil:dublu;
border-bottom-style:punct;)
Și în practică vom vedea acest rezultat.
Pentru a seta chenarul, trebuie să folosim atributul de stil border-width pentru care putem seta mai mulți parametri: primul este să setăm dimensiunea chenarului în pixeli sau să setăm grosimea folosind thin (thin line), medium (middle). linie) sau comenzi groase (linie groasă). De asemenea, putem seta grosimea liniei pentru orice parte a cadrului, indiferent de stilul setat pentru restul.
Să învățăm mai întâi cum să setăm grosimea liniei de margine direct pentru toate părțile. Pentru a face acest lucru, trebuie doar să setăm comanda border-width și să definim dimensiunea liniei pentru aceasta. Pentru a seta grosimea, textul va arăta astfel:
h1 (
chenar-stil:solid;
lățime margine:subțire;
}
Comanda subțire poate fi înlocuită cu mediu sau gros, sau puteți seta grosimea în pixeli specificând unitatea de măsură, de exemplu, o dimensiune de patru pixeli - 4px.
Acum vom seta parametrii de grosime pentru fiecare parte a cadrului nostru. La fel ca la setarea stilului, parametrii border-left-width (grosimea liniei din stânga), border-top-width (grosimea liniei de sus), border-right-width (grosimea liniei din dreapta) și border-bottom-width (grosimea liniei de jos) ne va ajuta liniile). Pentru a face acest lucru, vom adăuga patru linii cu următorul conținut în fișierul de stil:
h1 (
chenar-stil:solid;
chenar-stânga-lățime:mediu;
margine-sus-latime:subtire;
chenar-dreapta-latime:gros;
lățime-chenar-jos:7px;
}
Și acum toate cele patru laturi ale cadrului nostru vor avea propria lor grosime.
Cum să setați culoarea chenarului în CSS.
Să setăm acum culoarea chenarului în CSS și comenzile border-left-color, border-top-color, border-right-color și border-bottom-color ne vor ajuta cu aceasta să setăm culoarea pentru stânga, sus , liniile din dreapta și de jos ale graniței, respectiv . Pentru a face acest lucru, scriem comenzi și adăugăm un parametru de culoare la fiecare comandă.
h1 (
chenar-stil:solid;
border-left-color:#00CCCC;
border-top-color:#6633CC;
chenar-dreapta-culoare:#CCCCCC;
culoare-inferioară-chenar:#66CC99;
}
Și acum să vedem rezultatul aplicării acest parametru.
Setarea unei variabile globale pentru a prescurta intrarea.
Acum să vedem cum putem scăpa de astfel de structuri și înregistrări voluminoase. Pentru a face acest lucru, va trebui să setăm atributul chenar global în care vom seta parametri precum grosimea chenarului, stilul și culoarea chenarului, iar toate acestea se vor încadra nu în cel puțin trei linii, ci într-o singură linie.
Pentru a face acest lucru scriem linia:
h1 (
chenar:5px solid #3399FF;
}
în linie, mai întâi indicăm grosimea liniei cadrului, apoi un spațiu și indicăm stilul de design al cadrului și, din nou, printr-un spațiu, indicăm culoarea cadrului. Deci am redus cu toții intrarea la o singură linie.
Sper că datorită acestui articol veți putea seta chenare pentru toate elementele din CSS. Am încercat să vă concentrez atenția asupra celor mai necesare comenzi și să vă spun în detaliu cum să setați un chenar în CSS, să setați un stil de chenar în CSS și să setați o culoare a chenarului în CSS.
Pentru a separa în mod clar conținutul unei celule de cealaltă, celulele sunt adăugate margini. Responsabil pentru crearea lor parametru de frontieră etichetă
| Cheburashka | Crocodilul Gena | Shapoklyak |
Cadrele create în acest fel diferă ușor în aspect în diferite browsere.
Orez. 1. Bordura obtinuta folosind parametrul border
Pentru a obține un cadru de un singur tip, se recomandă utilizarea etichetei de stil de chenar, aplicând-o celulelor tabelului (etichetă
| 0 | X | X |
| 0 | 0 | X |
| X | X | 0 |
Diferența dintre marginile tabelului cu și fără parametrul border-collapse este prezentată în Fig. 2.
A
b
Orez. 2. Vizualizare tabel când se utilizează atributul border-colapase
În fig. Figura 2a prezintă cadrul implicit al tabelului. Vă rugăm să rețineți că în interiorul tabelului toate liniile au grosime dublă. Adăugarea parametrului border-collapse elimină această caracteristică, iar grosimea tuturor liniilor devine aceeași (Fig. 2b).
Pentru a dezvolta linii de același tip în tabel, puteți merge pe altă cale. Ar trebui adăugat pentru selector
| 0 | X | X |
| 0 | 0 | X |
| X | X | 0 |
Această metodă poate avea variații, de exemplu, pentru selector
sau
În acest exemplu, culoarea de fundal a paginii web este introdusă prin proprietatea de fundal adăugată la selectorul BODY. Cu toate că culoare alba este setat implicit, uneori este de dorit să îl setați astfel încât utilizatorul să nu-și specifice culoarea de fundal prin setările browserului. Liniile de tabel ar trebui să aibă, de asemenea, aceeași culoare; în acest caz, ele nu sunt clar vizibile și doar împart celulele între ele. Rezultatul Exemplului 4 este prezentat mai jos.
Orez. 3. Aspectul chenarelor care se potrivesc cu culoarea de fundal Cadru de masă element important. Este universal și des folosit. Această lecție vă va arăta cum să creați un cadru de tabel, o celulă și un rând folosind un atribut, dar partea principală a lecției se va concentra pe Proprietăți CSS deoarece cadrul devine generic atunci când se utilizează stiluri CSS. Crearea unui cadru folosind un atributÎn general, nu este un atribut extensibil, aș spune fără sens. Atributul border setează grosimea chenarului și atât. Mai jos este un exemplu:
O modalitate ușoară de a crea o chenar în jurul unui elementspun eu imediat înregistrări detaliate Nu o voi da aici, deoarece va exista o lecție uriașă despre proprietatea de frontieră în viitor și poate mai mult de una. Proprietate universală chenar poate seta grosimea, stilul și culoarea chenarelor (cadrelor) simultan. Grosimea poate fi orice, culoarea marginii este setată în format hexazecimal, format rgbȘi Cuvinte cheie(roșu, negru etc.). Ce stiluri există, poza de mai jos (poza luată de pe site-ul htmlbook.ru) și următorul exemplu: td( Cadru stânga, dreapta, jos și susCând utilizați chenar, se creează un cadru pe toate părțile. Dar putem controla din ce parte să desenăm cadrul. Chenar stânga chenar-stânga: 2px negru solid; chenar-dreapta chenar-dreapta: 1px punctat #FF0000 ; chenar-jos: 10px solid #000000 ; chenar-sus: 1px verde continuu. După cum puteți vedea, nu trebuie să aibă aceleasi valoriși, de asemenea, le puteți combina, adică scrieți mai multe, de exemplu, marginea stângă și dreaptă (cadru) etc. Toate. Nu voi merge mai departe, acesta este subiectul unei alte lecții. Exemplu: masa ( Colturi rotunjiteAcum să atingem puțin subiectul „frumusețe” și utilizare. Pentru ca marginile marginilor să fie rotunjite, există o proprietate border-radius. Este prea lecție separată, nu vom intra în multe detalii. El acceptă cantități diferite argumente. Vom scrie (doar în această lecție) un argument, iar dacă scriem o singură valoare, atunci va fi aceeași rotunjire pe toate părțile (colțurile). Valoarea poate fi în diferite „măsuri”, cum ar fi pixeli și procente. Mai jos este un exemplu: td( Margini sau umpluturăPentru a preveni ca textul să se alinieze la cadru, trebuie să-l indentați. Proprietatea de umplutură ne va ajuta în acest sens. Este și multifuncțională, dar o vom lua în considerare parțial, toate din același motiv. Vom folosi o singură valoare. Valoarea poate fi în diferite „măsuri”, cum ar fi pixeli și procente. Mai jos este un exemplu: td( Vlad Merjevici CU folosind CSS Puteți adăuga o chenar la un element în mai multe moduri. Practic, desigur, proprietatea de frontieră este utilizată, ca cea mai universală, precum și contur și, în mod surprinzător, cutie-umbră, a cărei sarcină principală este de a crea o umbră. În continuare, vom lua în considerare aceste metode și diferențele dintre ele. proprietate de conturCea mai simplă proprietate pentru crearea cadrelor. Are aceiași parametri ca și border , dar diferă semnificativ în unele detalii:
Se pune întrebarea - în ce cazuri este nevoie de contur, când rolul său, în ciuda diferențelor enumerate, este preluat complet de graniță? Nu există multe situații, dar apar:
Rame multicoloreTrebuie să înțelegeți că conturul nu înlocuiește în niciun caz chenarul și poate exista cu ușurință împreună cu acesta, așa cum se arată în exemplul 1. Exemplul 1: Crearea unui cadru
În acest exemplu, în jurul elementului este adăugat un cadru negru, care este separat de fundal printr-un chenar alb (Fig. 1). Orez. 1. Încadrați în jurul elementului Cadru când se utilizează: hoverCând se adaugă un cadru prin chenar, lățimea elementului crește, ceea ce este destul de vizibil când se combină chenar și pseudo-clasa :hover. Există două moduri de a „câștiga” acest lucru. Cel mai simplu lucru este să înlocuiți chenar cu outline , care, după cum știm, nu afectează dimensiunea elementului (exemplul 2). Exemplul 2: Cadru pe Hover
conturul nu este întotdeauna potrivit, fie și numai pentru că rotunjirea colțurilor nu îl afectează. A doua metodă este potrivită aici - adăugați un cadru invizibil sau un cadru care se potrivește cu culoarea de fundal, apoi modificați parametrii acestuia când treceți cu mouse-ul (exemplul 3). Atunci nu va avea loc nicio deplasare a elementului, deoarece cadrul inițial există deja. Dar ne amintim întotdeauna că lățimea elementului este suma valorilor lățimii, chenarul din stânga și chenarul din dreapta. Situația este similară cu înălțimea. Exemplul 3: Cadru pe Hover
Chenar în jurul câmpurilor de formularÎn unele browsere (Chrome, Safari, recent versiuni de opera) apare o pictogramă mică în jurul câmpurilor de formular atunci când acestea primesc focalizare. rama de culoare(Fig. 2). Pentru a-l elimina, trebuie doar să adăugați valoarea none la proprietatea contur din stiluri, așa cum se arată în exemplul 4. Orez. 2. Încadrați în jurul marginilor Exemplul 4. Scoaterea cadrului
Cadre prin box-shadowDeși proprietatea box-shadow este destinată să adauge o umbră în jurul unui element, poate fi folosită și pentru a crea chenare care nu pot fi create folosind border sau outline . Acest lucru se datorează faptului că numărul de umbre poate fi nelimitat, ai căror parametri sunt enumerați separați prin virgule. Pentru a obține un cadru, primii trei parametri ar trebui setați la zero; aceștia sunt responsabili pentru poziția umbrei și estomparea acesteia. Al patrulea parametru în acest caz este responsabil pentru grosimea chenarului, iar al cincilea setează culoarea chenarului. Pentru al doilea cadru, al patrulea parametru este egal cu suma grosimilor celor două rame. Exemplul 4 arată cum să adăugați două cadre și un chenar la dreapta folosind o singură proprietate casetă-umbră. Exemplul 4: Utilizarea box-shadow
Rezultat acest exemplu prezentat în Fig. 3.
Orez. 3. Cadre create de proprietatea box-shadow Specificația CSS oferă posibilități nelimitate pentru proiectarea tabelelor. În mod implicit, tabelul și celulele tabelului nu au margini sau fundal vizibile, iar celulele din tabel nu sunt adiacente una cu cealaltă. Lățimea celulelor tabelului este determinată de lățimea conținutului lor, astfel încât lățimea coloanelor tabelului poate varia. Înălțimea tuturor celulelor dintr-un rând este aceeași și este determinată de înălțimea celei mai înalte celule. Formatarea tabelelor1. Borduri de masăImplicit, tabelul și celulele din interiorul acestuia sunt afișate în browser fără margini vizibile. Borduri de masă sunt specificate de proprietatea de frontieră: Tabel (border-collapse: colaps; /*eliminare spatii libereîntre celule*/ chenar: 1px gri solid; /*setează o chenar exterioară pentru tabel gri 1px grosime*/) Marginile celulei antet fiecare coloană este specificată pentru al-lea element: Th (chenar: 1px gri solid;) Frontiere de celule corpurile de tabel sunt specificate pentru elementul td: Td (chenar: 1px gri solid;) Grosimea marginilor celulelor adiacente nu este dublată, așa că puteți seta margini pentru întregul tabel în felul următor: Th, td (chenar: 1px gri solid;) Puteți evidenția marginea exterioară a unui tabel oferindu-i o lățime crescută: Tabel (chenar: 3px gri solid;) Limitele pot fi stabilite parțial: /* setează un chenar exterior gri cu grosimea de 3 px pentru tabel */ table (border-top: 3px solid gray; ) /* setează un chenar gri cu grosimea de 1px pentru celula corpului tabelului */ td (border-bottom: 1px solid gri;) Puteți citi mai multe despre proprietatea de frontieră. 2. Cum să setați lățimea și înălțimea meseiMod implicit lățimea și înălțimea mesei determinată de conținutul celulelor sale. Dacă lățimea nu este specificată, atunci aceasta va fi egală cu lățimea celui mai lat rând (rând). Lățimea tabelului și a coloanei este setat folosind proprietatea width. Dacă pentru un tabel este specificat tabel (lățime: 100%;), atunci lățimea tabelului va fi egală cu lățimea blocului container în care se află. Lățimea tabelului și a coloanelor este de obicei specificată în px sau %, de exemplu: Tabel (lățime: 600 px;) th (lățime: 20%;) td:primul copil (lățime: 30%;) Înălțimea mesei nu este specificat. Înălțimea rândului tabelele pot fi manipulate prin adăugarea elementelor de umplutură de sus și de jos Și | . Fixarea înălțimii folosind proprietatea înălțime nu este recomandată. | Th, td (padding: 10px 15px;) 3. Cum să setați fundalul tabeluluiMod implicit fundal de masă iar celulele sunt transparente. Dacă pagina sau blocul care conține tabelul are un fundal, acesta va apărea prin tabel. Dacă fundalul este specificat atât pentru tabel, cât și pentru celule, atunci în locurile în care fundalul tabelului și al celulelor se suprapun, va fi vizibil doar fundalul celulelor. Fundalul tabelului ca întreg și al celulelor acestuia poate fi: 4. Coloane de tabelModelul de tabel CSS se concentrează în principal pe rânduri (rânduri) formate folosind eticheta folosind eticheta Puteți seta fundalul pentru orice număr de coloane; folosind tabelul de selecție td:first-child , table td:last-child puteți seta stiluri pentru prima sau ultima coloană a tabelului (cu excepția primei celule a antetului tabelului); Folosind selectorul de tabel td:nth-child (regula de selecție a coloanelor), puteți seta stiluri pentru orice coloană de tabel. Puteți citi mai multe despre selectoarele CSS. 5. Cum să adăugați un titlu de tabelPuteți adăuga un titlu la un tabel folosind o etichetă
 Orez. 2. Exemplu de afișare a unui antet sub un tabel 6. Cum să eliminați spațiul dintre cadrele celulareÎn mod implicit, cadrele celulelor tabelului sunt separate printr-un spațiu mic. Dacă setați border-collapse: collapse pentru tabel, decalajul va fi eliminat. Proprietatea este moștenită. Sintaxă Tabel (border-collapse: collapse;) 7. Cum să măriți spațiul dintre cadrele celularePrin utilizarea proprietăți de frontieră-spațierea vă permite să modificați distanța dintre cadrele de celule. Această proprietate se aplică tabelului în ansamblu. Mostenit. Sintaxă Tabel (border-collapse: separat; border-spacing: 10px 20px;) tabel (border-collapse: separat; border-spacing: 10px;) 8. Cum să ascundeți celulele goale ale tabeluluiProprietatea celule goale ascunde sau arată celulele goale. Afectează numai celulele care nu conțin conținut. Dacă o celulă este setată pe fundal și un tabel este setat pe tabel (border-collapse: collapse;) , atunci celula nu va fi ascunsă. Mostenit.
 Orez. 5. Exemplu de ascundere celulă goală Mese 9. Aranjați un tabel utilizând proprietatea table-layoutAspectul tabelului este determinat de una dintre două abordări: aspect fix sau aspect automat. În acest caz, aspectul se referă la modul în care lățimea tabelului este distribuită între lățimile celulelor. Proprietatea nu este moștenită. Sintaxă Tabel (aspect de masă: fix;) 10. Cele mai bune scheme de masă1. Minimalism orizontalTabelele orizontale sunt tabele în care textul este citit orizontal. Fiecare entitate este un rând separat. Puteți da astfel de tabele un aspect minimalist prin plasarea unui chenar de doi pixeli sub antetul al-lea.
La cantitati mari rânduri, acest design de tabel le face dificil de citit. Pentru a rezolva această problemă, puteți adăuga un chenar de un pixel sub toate elementele td. Td ( chenar-jos: 1px solid #ccc; culoare: #669; padding: 9px 8px; tranziție: .3s liniar; )/*restul codului este ca în exemplul de mai sus*/ Adăugarea unui efect :hover la elementul tr va face tabelele concepute într-un stil minimalist mai ușor de citit. Când treceți mouse-ul peste o celulă, celulele rămase din același rând sunt evidențiate simultan, ceea ce face mai ușoară urmărirea informațiilor dacă tabelele au mai multe coloane. Th (greutate font: normal; culoare: #039; umplutură: 10px 15px; ) td (culoare: #669; chenar-sus: 1px solid #e8edff; umplutură: 10px 15px; ) tr:hover td (fond: #e8edff ;) 2. Minimalism verticalDeși astfel de tabele sunt rar utilizate, tabelele orientate vertical sunt utile pentru clasificarea sau compararea descrierilor obiectelor reprezentate de o coloană. Le puteți proiecta într-un stil minimalist adăugând spațiu pentru a separa coloanele. Th (greutate font: normal; chenar-jos: 2px solid #6678b1; chenar-dreapta: 30px continu #fff; chenar-stânga: 30px solid #fff; culoare: #039; umplutură: 8px 2px; ) td ( chenar- dreapta: 30px solid #fff; chenar-stânga: 30px solid #fff; culoare: #669; umplutură: 12px 2px; ) 3. Stilul cutieCel mai de încredere stil pentru proiectarea meselor de toate tipurile este așa-numitul stil „cutie”. Este suficient să alegi unul bun schema de culori, apoi setați culoarea de fundal pentru toate celulele. Nu uitați să subliniați diferența dintre linii prin setarea chenarelor ca separator. Th ( dimensiunea fontului: 13px; greutatea fontului: normal; fundal: #b9c9fe; chenar-sus: 4px solid #aabcfe; chenar-bottom: 1px solid #fff; culoare: #039; umplutură: 8px; ) td ( fundal : #e8edff; chenar-jos: 1px solid #fff; culoare: #669; chenar-sus: 1px solid transparent; umplutură: 8px; ) tr:hover td (fond: #ccddff;) Cel mai dificil este să găsești schema de culori care se va combina armonios cu site-ul tău. Dacă site-ul are o grămadă de grafică și design, atunci îți va fi destul de dificil să folosești acest stil. Tabel (familie de fonturi: „Lucida Sans Unicode”, „Lucida Grande”, Sans-Serif; dimensiunea fontului: 14px; lățime maximă: 70%; lățime: 70%; alinierea textului: centru; restrângere chenar: restrângere ; chenar-sus: 7px solid #9baff1; chenar-jos: 7px solid #9baff1; ) th (dimensiunea fontului: 13px; greutatea fontului: normal; fundal: #e8edff; chenarul-dreapta: 1px solid #9baff1; chenar- stânga: 1px solid #9baff1; culoare: #039; umplutură: 8px; ) td ( fundal: #e8edff; chenar-dreapta: 1px solid #aabcfe; chenar-stânga: 1px solid #aabcfe; culoare: #669; căptușeală: 8px ;) 4. Zebră orizontalăMasa cu zebră arată destul de atractivă și confortabilă. O culoare suplimentară de fundal poate servi drept indiciu vizual pentru oameni când citesc tabelul. Th ( greutate font: normal; culoare: #039; umplutură: 10px 15px; ) td ( culoare: #669; chenar-sus: 1px solid #e8edff; umplutură: 10px 15px; ) tr:nth-child(2n) ( fundal: #e8edff;) 5. Stilul ziaruluiPentru a obține așa-numitul efect de ziar, puteți aplica chenare elementelor de tabel și puteți juca cu celulele din interior. Un stil de ziar ușor și minimalist ar putea arăta astfel: jucați-vă cu schema de culori, adăugați chenaruri, umplutură, medii diferite, și efect:hover când treceți cu mouse-ul peste o linie. Tabel (chenar: 1px solid #69c;) th (greutate font: normal; culoare: #039; chenar-jos: 1px punct #69c; umplutură: 12px 17px; ) td (culoare: #669; umplutură: 7px 17px; ) tr:hover td (fond: #ccddff;)
Tabel (chenar: 1px solid #69c;) th (greutate font: normal; culoare: #039; umplutură: 10px; ) td (culoare: #669; chenar-sus: 1px întreruptă #fff; umplutură: 10px; fundal: #ccddff; ) tr:hover td (fond: #99bcff;)
Tabel (chenar: 1px solid #6cf;) th ( font-weight: normal; font-size: 13px; culoare: #039; text-transform: majuscule; margine-dreapta: 1px solid #0865c2; chenar-sus: 1px solid #0865c2; chenar-stânga: 1px solid #0865c2; chenar-jos: 1px solid #fff; umplutură: 20px; ) td (culoare: #669; chenar dreapta: 1px întreruptă #6cf; umplutură: 10px 20px; ) 6. Fundalul tabeluluiDacă sunteți în căutarea unui rapid și mod unic design mese, selectați imagine atractivă sau fotografie legată de tema mesei și setați-o ca fundal al mesei. Jpg") fără repetare; poziție fundal: 100% 55px; ) th ( greutate font: normal; culoare: #339; umplutură: 10px 12px; ) td ( fundal: url("https://site/images/ spate..png"); fundal: transparent; ) Cele mai bune articole pe această temă |
Orez. 3. Exemplu de tabele cu cadre de celule combinate și separate
Orez. 4. Exemplu de tabele cu spații mari între cadrele de celule
