logo

Как да центрирам таблица в CSS?

Използването на таблици при проектирането на уебсайт е вълнуваща задача. По подразбиране подравняването на таблицата е вляво, но с помощта на марж свойство в CSS, можем да го подравним в центъра.

Ако зададем стойността на margin-left и margin-right да се Автоматичен , тогава браузърите показват таблицата центрирана. Можем да използваме свойството за стенограма марж и го настройте на Автоматичен за подравняване на масата в центъра, вместо да използвате margin-left и margin-right Имот.

обяснете независимостта на данните

Вместо да подравните масата към центъра, подравняване на текст: център; Свойството само центрира съдържанието на таблицата, като например текста в таблицата.

Нека разберем това, като използваме илюстрация.

Пример

В този пример ние използваме подравняване на текст: център; свойство за центриране на съдържанието вътре в таблицата и margin-left: автоматично; и margin-right: автоматично; за центриране на масата.

 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> 
Тествайте сега

Изход

алгоритъм на кабината
Как да центрирам таблица в CSS?