Metoda 1: Utilizarea atributului „lățime” HTML
„ lăţime ” este un atribut de bază oferit de HTML. Setează lățimea sau lungimea orizontală a elementului HTML. Pentru a remedia datele din tabel, atributul width este utilizat în pașii de mai jos.
Pasul 1: Creați un tabel Pasul 2: Adăugați proprietăți CSS la elementul „tabel”. Pasul 3: Atribuirea proprietăților elementului „td”. Pasul 4: Atribuirea proprietăților elementului „al-lea”. Ieșirea este afișată ca: Instantaneul de mai sus arată că toate lățimile coloanei sunt fixate la 30% fiecare. Proprietatea nth-child() a CSS este folosită pentru a crea un tabel cu lățime fixă. Această proprietate primește numărul coloanei și selectează „ Ieșirea blocului de cod de mai sus este: Această ieșire afișează că numerele coloanelor 1 și 3 sunt fixate la lățimea de 10%. În interiorul ' masa ” secțiunea din porțiunea CSS adăugați „ tabel-layout: fix ” pentru a seta „lățimea” elementelor tabelului de date: În fișierul HTML, adăugați „ După executarea fragmentului de cod de mai sus, rezultatul este: Acesta este modul în care utilizatorul poate fixa lățimea elementelor Pentru a fixa lățimea datelor din tabel, utilizați „ lăţime „atribut,” al-al-lea copil ( ) „separator și „
În fișierul HTML, utilizați un „ ' și ' ” etichetează și scrie date în el:
< centru >
< masa >
< tr >
< th > Nume < / th >
< th > stare < / th >
< th > Camera nr < / th >
< / tr >
< tr >
< td > Fakhar < / td >
< td > Student < / td >
< td > 06 < / td >
< / tr >
< tr >
< td > Omar < / td >
< td > Student < / td >
< td > 06 < / td >
< / tr >
< / masa >
< / centru >
Utilizați selectorul de elemente de tabel în CSS și adăugați „ frontieră „de 1px roșu continuu, „ aliniere text ” aliniază textul la centru și „ lăţime ” care setează lățimea totală a tabelului la 80%:
masa {
frontieră : 1px roșu continuu;
text- alinia : centru;
lăţime : 80 %; }
Folosește ' td ” selector de elemente și setează „ chenar-de jos ” de 5 pixeli roșu continuu, ” umplutura ” de 20 px pentru a face elementul mai proeminent și ” lăţime ” se stabilește la 30%:
td {
chenar-jos: 5px roșu continuu;
umplutură: 20px;
lăţime : 30 %;
}
Folosește ' th ' selector de elemente pentru a schimba culoarea lui ' chenar-de jos ” de la roșu la verde mare pentru a crea o vizualizare mai bună:
th {
chenar-partea de jos: 5px solid seagreen;
umplutură: 20px;
lăţime : 30 %;
}
Metoda 2: Folosind selectorul „nth-child( )”.
' și ' ' Etichete. De exemplu, lățimea este „ fix ” numai pentru numerele coloanelor ” 1 ' și ' 3 ”. Fiecare dintre aceste coloane primește o lățime de 10%. Acest articol a demonstrat cu succes cum să remediați lățimea tabelului de date. td:nth-copil ( 3 ) {
lăţime : 10 %;
}
al-lea:al-lea-copil ( 1 ) {
lăţime : 10 %;
}
Metoda 3: Utilizarea etichetei
tabel-aspect: fix;
lăţime : 80 %;
frontieră : 1px roșu continuu;
text- alinia : centru;
}
< col stil = 'lățime: 15%;' / >
< col stil = 'lățime: 30%;' / >
de date din tabel.
Concluzie
de date din tabel.