Metoda 1: Korištenje HTML atributa “width”.
' širina ” je osnovni atribut koji pruža HTML. Postavlja širinu ili horizontalnu duljinu HTML elementa. Za ispravljanje podataka tablice, atribut širine koristi se u koracima u nastavku.
Korak 1: Napravite tablicu Korak 2: Dodajte CSS svojstva elementu 'table'. Korak 3: Dodjeljivanje svojstava elementu 'td'. Korak 4: Dodjeljivanje svojstava 'tom' elementu Izlaz se prikazuje kao: Gornja snimka pokazuje da su širine svih stupaca fiksne na 30%. Svojstvo nth-child() CSS-a koristi se za stvaranje tablice fiksne širine. Ovo svojstvo dobiva broj stupca i odabire ' Izlaz gornjeg bloka koda je: Ovaj izlaz prikazuje da su brojevi stupaca 1 i 3 fiksirani na širinu od 10%. Unutar ' stol ' u CSS dijelu dodajte ' raspored tablice: fiksno ” za postavljanje “širine” elemenata podatkovne tablice: U HTML datoteku dodajte ' Nakon izvršavanja gornjeg isječka koda, izlaz je: Na taj način korisnik može popraviti širinu podataka tablice Da biste popravili širinu podataka tablice, koristite ' širina 'atribut', n-to dijete( ) ” razdjelnik i “
U HTML datoteci upotrijebite ' ' i ' ” oznake i upišite podatke u nju:
< centar >
< stol >
< tr >
< th > Ime < / th >
< th > Status < / th >
< th > soba br < / th >
< / tr >
< tr >
< td > Fakhar < / td >
< td > Student < / td >
< td > 06 < / td >
< / tr >
< tr >
< td > Omar < / td >
< td > Student < / td >
< td > 06 < / td >
< / tr >
< / stol >
< / centar >
Koristite selektor elementa tablice u CSS-u i dodajte ' granica ” od 1 px puno crveno, “ poravnanje teksta ” poravnava tekst prema sredini, a “ širina ” koji postavlja ukupnu širinu tablice na 80%:
stol {
granica : 1px puno crveno;
tekst- uskladiti : centar;
širina : 80 %; }
Koristiti ' td ” selektor elementa i postavlja „ granica-dno ” od 5 px puno crveno, “ podstava ” od 20 px kako bi stavka bila istaknutija i “ širina ” postavlja na 30%:
td {
rub-bottom: 5px puno crveno;
padding:20px;
širina : 30 %;
}
Koristiti ' th ” selektor elementa za promjenu boje “ granica-dno ” od crvene do morsko zelene za stvaranje bolje vizualizacije:
th {
rub-bottom: 5px puna morskozelena;
padding:20px;
širina : 30 %;
}
Metoda 2: Korištenje selektora “nth-child( )”.
' i ' ' oznake. Na primjer, širina je ' fiksni ” samo za brojeve stupaca “ 1 ' i ' 3 ”. Svaki od ovih stupaca dobiva širinu od 10%. Ovaj je članak uspješno pokazao kako popraviti širinu podatkovne tablice. td:n-to dijete ( 3 ) {
širina : 10 %;
}
th:nth-dijete ( 1 ) {
širina : 10 %;
}
Metoda 3: Korištenje oznake
raspored tablice: fiksni;
širina : 80 %;
granica : 1px puno crveno;
tekst- uskladiti : centar;
}
< kol stil = 'širina: 15%;' / >
< kol stil = 'širina: 30%;' / > elemenata.
Zaključak
elemenata.