Ако сте начинаещ уеб дизайнер, може да имате въпроси как да центрирате текста вътре в клетка на таблица. С това ръководство научете тази техника само за няколко минути. Лесно е - дори никога преди да не сте опитвали.
Приготвяме се да започнем
Центриране на текст вътре в клетка е най-добре да се направи с CSS, точно както бихте центрирали текста в друг елемент на вашата уеб страница. Преди да започнете обаче, трябва да решите какво точно искате да бъде центрирано. С таблица имате няколко опции, включително всяка клетка в таблицата; всяка клетка на заглавката в таблицата всяка клетка в главата на масата, тялото на тялото или крака на таблицата. Можете също така да центрирате конкретна клетка или набор от клетки в таблицата.
Освен това трябва да създадете вътрешен лист със стилове в главата на вашия документ или прикрепен към документа като външен лист със стилове. Ще поставите стиловете, за да центрирате клетките на таблицата в този лист със стилове.
Как да центрирате всяка клетка в таблицата
Добавете следните редове към вашия лист със стилове:
td, th {
подравняване на текст: център;
}
Как да центрирате всяка заглавна клетка в таблицата
Добавете следните редове към вашия лист със стилове:
th {
подравняване на текст: център;
}
Центриране на всяка клетка в главата, тялото или стъпалото на масата
За да центрирате тези клетки, трябва да добавите маркери на таблици, които не винаги се използват, като например.
thead th, thead td {
подравняване на текст: център;
}
tbody th, tbody td {
подравняване на текст: център;
}
tfoot th, tfoot td {
подравняване на текст: център;
}
Премахнете стиловете за областите, които не искате да бъдат центрирани.
Как да центрирате конкретна клетка или клетки в таблица
За да направите това, трябва да зададете клас на клетките, които искате да бъдат центрирани.
Добавете следния атрибут към клетките на таблицата, които искате да бъдат центрирани:
След това добавете следното към вашия стилов лист:
.centered-cell {
подравняване на текст: център;
}
Можете да добавите този клас към всяка клетка във вашата таблица.
Обобщавайки
Не се колебайте да използвате тези стилове в някоя от клетките на вашата таблица. Можете да ги използвате в обединени клетки или в единични клетки и текстът вътре ще бъде центриран.