1. módszer: HTML „width” attribútum használata
A ' szélesség ” a HTML által biztosított alapvető attribútum. Beállítja a HTML elem szélességét vagy vízszintes hosszát. A táblázat adatainak javításához a szélesség attribútumot használjuk az alábbi lépésekben.
1. lépés: Hozzon létre egy táblázatot 2. lépés: Adja hozzá a CSS-tulajdonságokat a „tábla” elemhez 3. lépés: Tulajdonságok hozzárendelése a „td” elemhez 4. lépés: Tulajdonságok hozzárendelése az „edik” elemhez A kimenet a következőképpen jelenik meg: A fenti pillanatkép azt mutatja, hogy az összes oszlop szélessége 30%-ban van rögzítve. A CSS nth-child() tulajdonsága fix szélességű tábla létrehozására szolgál. Ez a tulajdonság megkapja az oszlopszámot, és kiválasztja a „ A fenti kódblokk kimenete: Ez a kimenet azt mutatja, hogy az 1-es és 3-as oszlopok 10%-os szélességben vannak rögzítve. Benne ' asztal ' szakaszban a CSS részben adja hozzá a ' táblázat-elrendezés: fix ” tulajdonság az adattábla elemeinek „szélességének” beállításához: A HTML-fájlban adja hozzá a „ A fenti kódrészlet végrehajtása után a kimenet a következő: Így tudja a felhasználó rögzíteni a táblázat adat A táblázat adatainak szélességének rögzítéséhez használja a „ szélesség ' tulajdonság, ' n-edik gyermek( ) ' elválasztó és '
A HTML fájlban használjon egy „ ” és „ ” címkéket, és írjon bele adatokat:
< központ >
< asztal >
< tr >
< th > Név < / th >
< th > Állapot < / th >
< th > számú szoba < / th >
< / tr >
< tr >
< td > Fakhar < / td >
< td > Diák < / td >
< td > 06 < / td >
< / tr >
< tr >
< td > Omar < / td >
< td > Diák < / td >
< td > 06 < / td >
< / tr >
< / asztal >
< / központ >
Használja a táblázatelem-választót a CSS-ben, és adja hozzá a „ határ ' of 1px folyamatos piros, ' szöveg igazítás ' középre igazítja a szöveget, és ' szélesség ', amely a táblázat teljes szélességét 80%-ra állítja:
asztal {
határ : 1px egyszínű vörös;
szöveg- igazítsa : középen;
szélesség : 80 %; }
Használja a ' td ' elemválasztót, és beállítja a ' határ-alsó ' 5 képpontból egyszínű piros, ' párnázás ' 20 képpont, hogy az elem szembetűnőbb legyen, és ' szélesség ” 30%-nak állítja be:
td {
szegély-alsó: 5 képpont egyszínű piros;
padding:20px;
szélesség : 30 %;
}
Használja a ' th ' elemválasztó a ' színének megváltoztatásához határ-alsó ” vörösről tengerzöldre a jobb megjelenítés érdekében:
th {
szegély-alsó: 5 képpont tömör tengerzöld;
padding:20px;
szélesség : 30 %;
}
2. módszer: Az „nth-child( )” választó használata
” és „ ” címkéket. Például a szélesség ' rögzített 'csak oszlopszámokhoz' 1 ” és „ 3 ”. Ezen oszlopok mindegyikének szélessége 10%. Ez a cikk sikeresen bemutatta az adattábla szélességének javítását. td:nth-child ( 3 ) {
szélesség : 10 %;
}
th:nth-child ( 1 ) {
szélesség : 10 %;
}
3. módszer:
asztal-elrendezés: fix;
szélesség : 80 %;
határ : 1px egyszínű vörös;
szöveg- igazítsa : középen;
}
< col stílus = 'szélesség: 15%;' / >
< col stílus = 'szélesség: 30%;' / >
elemeinek szélességét.
Következtetés
táblázatadatelemek szélességét.