logo

Ako vycentrovať tabuľku v CSS?

Použitie tabuliek pri navrhovaní webovej stránky je vzrušujúca úloha. Štandardne je zarovnanie tabuľky vľavo, ale pomocou marža vlastnosť v CSS , môžeme ju zarovnať na stred.

Ak nastavíme hodnotu ľavý okraj a okraj-pravý do auto , potom prehliadače zobrazia tabuľku vycentrovanú. Môžeme použiť vlastnosť skratky marža a nastavte ho na auto na zarovnanie stola na stred namiesto použitia ľavý okraj a okraj-pravý nehnuteľnosť.

ako získať hru holub na android

Namiesto zarovnania tabuľky na stred, text-align: center; vlastnosť len vycentruje obsah tabuľky, ako napríklad text vo vnútri tabuľky.

Pochopme to pomocou ilustrácie.

zapuzdrenie java

Príklad

V tomto príklade používame text-align: center; vlastnosť na vycentrovanie obsahu vo vnútri tabuľky a ľavý okraj: auto; a pravý okraj: auto; na vycentrovanie stola.

 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> 
Vyskúšajte to

Výkon

Ako vycentrovať tabuľku v CSS?