Jak vycentrovat text v buňce tabulky

Pokud jste nováček web designer, můžete mít otázky o tom, jak vycentrovat text uvnitř buňky tabulky. S touto příručkou ovládněte tuto techniku ​​během několika minut. Je to snadné - i když jste se nikdy předtím nepokusili.

Začínáme

Centrum textu uvnitř buňky se nejlépe provádí pomocí CSS, stejně jako byste vycentrovali text v jiném elementu na vaší webové stránce. Než začnete, musíte se rozhodnout, co přesně chcete být soustředěno. S tabulkou máte několik možností, včetně každé buňky v tabulce; každá buňka záhlaví v tabulce každé buňky v hlavičce tabulky, tělese tabulky nebo noze stolku. Můžete také vycentrovat určitou buňku nebo skupinu buněk v tabulce.

Kromě toho byste měli vytvořit vnitřní stylový list v hlavičce dokumentu nebo připojený k dokumentu jako externí stylový list . Styly umístíte do středu buněk tabulky.

Jak centrovat každou buňku v tabulce

Přidejte do listu stylů následující řádky:

td, th {text-align: center; }}

Jak centrovat každou záhlaví buňky v tabulce

Přidejte do listu stylů následující řádky:

th {text-align: center; }}

Středění každé buňky v hlavě, těle nebo noze stolku

Chcete-li tyto buňky vycentrovat, je třeba přidat tabulkové značky, které nejsou vždy používány, například , a . Poté obklopíte buňky tabulky pomocí těchto značek, abyste identifikovali hlavu, tělo a nohu stolku. Poté přidáte do listu stylů následující položky:

thead th, thead td {text-zarovnání: centrum; } tbody th, tbody td {text-zarovnání: centrum; } tfoot th, tfoot td {text-zarovnání: centrum; }}

Odstraňte styly oblastí, které nechcete být vystředěny.

Jak vycentrovat konkrétní buňku nebo buňky v tabulce

Chcete-li to provést, je třeba nastavit třídu na buňkách, které chcete centrovat.

Přidejte následující atribut do buněk tabulky, které chcete vycentrovat:

class = "centrovaná buňka" >

Poté přidejte do listu stylů následující položky:

.centered-cell {text-align: center; }}

Tuto třídu můžete přidat do libovolné buňky v tabulce.

Obalování nahoru

Neváhejte použít tyto styly na libovolné buňce tabulky. Můžete je použít na sloučených buňkách nebo na jednotlivých buňkách a text v nich bude vystředěn.