Utilizarea HTML într-un tabel
În HTML există atât de multe elemente și fiecare dintre ele este unică în felul său. Tabelul este un obiect foarte interesant, solicitat și serios. Datorită acesteia, nu numai că puteți furniza informații într-o formă convenabilă, ci și să construiți un cadru întreg al site-ului.
conținut
Anterior, aproape toți webmasterii au folosit tabele pentru aspectul site-ului. Inițial, tabelele pentru acest lucru nu au fost inventate. Prin urmare, pentru marcarea site-ului, trebuie să utilizați elementul div block.
Dacă nu vrei să fii întotdeauna un novice, obișnuiești să faci totul imediat. Acest lucru este foarte important în HTML. În tabel, trebuie să plasați doar informațiile obișnuite (text, link-uri, liste, imagini etc.) și nu întregul site.
Cum se face un tabel HTML?
O masă este un element complex, care constă dintr-un număr mare de alte elemente. Rețineți că atunci când creați celule sau rânduri, trebuie să introduceți întotdeauna o etichetă de închidere simultan. În caz contrar, totul va dispărea. Operatorul din browser va căuta sfârșitul elementului și, până la găsirea lui, totul va fi inclus în tabel. Rezultatul va fi terciul.
Dacă scrieți un site web în "Notepad", atunci tot ce trebuie să faceți cu mâinile. Dacă în editorul finit există mai multe butoane - "introduceți o masă", "inserați o imagine" și așa mai departe.
Exemplu de tabele de la 2 la 2.
textul primei celule din prima linie
textul celei de-a doua celule din prima linie
textul primei celule din linia a doua
textul celei de-a doua celule a celei de-a doua linii
tag-uri
Principala regulă: numărul de celule din fiecare linie trebuie să fie același. Acesta este un tabel.
Dar, ca și în editorul Word și Excel, celulele pot fi combinate între ele.
Cum să îmbinați celule într-o masă?
Pentru a combina, utilizați atributele Colspan și Rowspan. Span se traduce prin "îmbrățișare" sau "suprapunere". Sensul literal este de a acoperi / acoperi celule / linii.
În valoarea acestui atribut, trebuie să specificați câte rânduri sau celule vor fi blocate. Următoarele reprezintă un exemplu ilustrativ al utilizării ambelor Atributele HTML în tabel.
În acest exemplu, pe prima linie, 3 celule au fost combinate folosind atributul colspan = "3". Apoi, prima celulă a celei de-a doua linii a fost întinsă în patru linii. Amintiți-vă că ne întindem / unim numai în prima celulă. Proprietatea sa va fi extinsă în continuare. Tot ceea ce merge înainte nu va fi afectat.
Dacă aveți 5 celule și doriți să fuzionați de la 2 la 4, atunci trebuie doar să specificați atributul colspan = "3" în celula 2.
Observați numărul celulei 9 din figura de mai sus. Acolo au combinat imediat celule și linii. Astfel de acțiuni nu sunt interzise.
Uitați-vă la un alt exemplu pentru a remedia informațiile. Din moment ce unele atribute confunda si uneori combina siruri de caractere in loc de celule.
Proiectare mese
Luați în mod obișnuit cazul HTML standard. Masa are două rânduri de câte două celule fiecare.
Rezultatul codului va fi următorul.
După cum puteți vedea, nu există efecte. Puteți adăuga un cadru, specificați lățimea și înălțimea.
Puteți, de asemenea, să jucați cu alinierea. Puteți alinia atât înălțimea cât și lățimea.
Aliniați alinierea orizontală și aliniați vertical. Iată rezultatul.
Atributul Align și Valign poate fi aplicat întregului șir. Apoi, toate celulele care se află în ea vor respecta aceste atribute.
În plus față de etichete
Cum se conectează stilurile la un tabel?
Ca orice HTML tag-uri, masa poate fi convertită prin stiluri. Trebuie să specificați un fișier de stil în regiunea capului sau un stil gata (indicat și în cap).
...
tabel {
font-family: Verdana, Arial, Helvetica, sans-serif-
culoare: # 000000-
}
.my_class
{
culoare: # 666666-
}
...
Dacă ați specificat doar o masă, atunci acest stil se va aplica tuturor tabelelor din pagină. Absolut pentru toți. Dar, dacă utilizați a doua metodă, unde specificați un nume arbitrar cu o perioadă, atunci acest stil poate fi aplicat la orice tabel dorit, fără a afecta altele.
Rețineți că clasele pot fi utilizate atât pentru eticheta tabelă, cât și pentru o anumită celulă sau șir.
textul primei celule din prima linie
textul celei de-a doua celule din prima linie
textul primei celule din linia a doua
textul celei de-a doua celule a celei de-a doua linii
Dacă există o eroare în numele stilului, nu veți vedea rezultatul. Dacă există greșeli în stilul în sine, dar numele coincid, nu va exista niciun efect. Fiecare virgulă sau colon este importantă.
Atribute adiționale pentru tabele
Ce atribute pot fi scrise în clase de stil? Există atât de multe atribute care se aplică la mese. Luați în considerare cele mai elementare de care aveți nevoie.
alinia | Aliniere orizontală |
valign | Aliniere verticală |
fundal | Imagine de fundal în celulă / tabel |
bgcolor | Culoarea de fundal în celulă |
borderColor | Tabelul / culoarea frontierei celulei |
înălțime | Inaltimea celulei |
nowrap | Interzice transferul de text într-o linie. |
lățime | Lățimea celulei / tabelului |
După cum puteți vedea, puteți folosi HTML în tabel cu un număr imens de "instrumente".
Frumos a fost creat folosind tabele HTML. exemple
Datorită stilurilor, puteți crea diferite mese frumoase. Totul depinde de ceea ce vă place și cum. E ca la gătit. Ingredientele sunt aceleași, dar există o mulțime de rețete.
După cum puteți vedea, dacă utilizați etichete HTML, tabelul poate fi transformat fără recunoaștere. Limitele posibilităților sunt determinate de imaginația ta.
- Cum se rotește tabelul și textul "Word" în tabelul propriu-zis
- Cum combinați două tabele în "Word" orizontal sau vertical
- Ce este un link pe Internet și în programul `Word`?
- Limita site-ului: de unde să încep?
- Cum se face un tabel în HTML: descriere detaliată
- Ce este o tabelă de culori HTML și pentru ce este?
- HTML-cod. Coduri HTML HTML
- Cum se face un tabel HTML. Tabel de culori
- Despre cum să transferați tabelul din Excel în Word
- Cum de a desena o masă în Word? Răspunsul va solicita programul în sine
- Amenajarea site-ului: cum se face o imagine de fundal în html
- Comenzi HTML pentru crearea site-urilor Web
- O lecție în HTML. Mergeți celulele
- Lista principalelor etichete HTML
- Aplicați CSS în centru: text și tabel
- Ce este antetul HTML?
- Învățați cum să faceți un link către site
- Care este "aspectul div" atunci când creați un site, argumentele sale pro și contra
- Ce este aspectul site-ului? Arhivare tabelară și bloc: diferențe
- Sfat util: Caracteristici și moduri de creare
- Cum să vă conectați la pagina dvs. de site