logo

Hogyan lehet középre helyezni egy táblázatot CSS-ben?

A táblázatok használata a weboldal tervezésében izgalmas feladat. Alapértelmezés szerint a táblázat igazítása balra történik, de a árrés tulajdonság a CSS-ben, középre igazíthatjuk.

Ha beállítjuk az értékét margó-bal és margó-jobb nak nek auto , akkor a böngészők középen jelenítik meg a táblázatot. Használhatjuk a gyorsírás tulajdonságot árrés és állítsa be auto az asztal középre igazításához, nem pedig a margó-bal és margó-jobb ingatlan.

hallgassa meg a portot

A táblázat középre igazítása helyett a szöveg igazítása: középre; tulajdonság csak a táblázat tartalmát helyezi középre, például a táblázaton belüli szöveget.

Értsük meg ezt egy illusztráció segítségével.

java 8

Példa

Ebben a példában a szöveg igazítása: középre; tulajdonság a tartalom középpontba helyezéséhez a táblázaton belül és margó-bal: auto; és margó-jobb: auto; az asztal közepére.

 table, th, td { border: 1px solid black; margin-left: auto; margin-right: auto; border-collapse: collapse; width: 500px; text-align: center; font-size: 20px; } <table class="table"> <tr> <th>First_Name</th> <th>Last_Name</th> <th>Subject</th> <th>Marks</th> </tr> <tr> <td>James</td><td>Gosling</td><td>Maths</td><td>92</td> </tr> <tr> <td>Alan</td><td>Rickman</td><td>Maths</td><td>89</td> </tr> <tr> <td>Sam</td><td>Mendes</td><td>Maths</td><td>82</td> </tr> </table> 
Tesztelje most

Kimenet

Hogyan lehet középre helyezni egy táblázatot CSS-ben?