Ako centrovanie textu v bunke tabuľky

Ak ste nováčik webdesigner, môžete mať otázky, ako vycentrovať text vnútri bunky tabuľky. S touto príručkou zvládnite túto techniku ​​za niekoľko minút. Je to jednoduché - aj keď ste sa nikdy predtým nepokúšali.

Začíname

Vycentrovanie textu vnútri bunky sa najlepšie vykoná pomocou CSS, rovnako ako v strede textu v inom prvku na vašej webovej stránke. Skôr ako začnete, musíte sa rozhodnúť, na čo chcete byť zamerané. S tabuľkou máte niekoľko možností vrátane každej bunky v tabuľke. každá bunka hlavičky v tabuľke každej bunky v hlave stola, telese tabuľky alebo nohy stola. V tabuľke môžete tiež vycentrovať určitú bunku alebo skupinu buniek.

Okrem toho by ste mali vytvoriť interný štýl písma v hlavičke dokumentu alebo pripojený k dokumentu ako externý štýl . Styly umiestnite tak, aby vycentrovali bunky tabuľky v tomto štýle.

Ako vycentrovať každú bunku v tabuľke

Pridajte do svojej šablóny štýlov nasledujúce riadky:

td, th {text-align: center; }

Ako vycentrovať každú bunku hlavičky v tabuľke

Pridajte do svojej šablóny štýlov nasledujúce riadky:

th {text-align: center; }

Zostrihnutie každej bunky v hlave, tele alebo nohe

Ak chcete centrávať tieto bunky, musíte pridať tabuľkové značky, ktoré nie sú vždy používané, napríklad , a . Potom obklopíte bunky tabuľky pomocou týchto značiek, aby ste identifikovali hlavu, telo a nohu stola. Potom pridáte do svojho štýlu hárkov:

thead th, thead th {text-align: center; } tbody th, tbody td {text-zarovnanie: centrum; } tfoot th, tfoot td {text-zarovnanie: centrum; }

Odstráňte štýly pre oblasti, ktoré nechcete byť vycentrované.

Ako centrovanie špecifickej bunky alebo buniek v tabuľke

Ak to chcete urobiť, musíte nastaviť triedu na bunky, ktoré chcete centrovať.

Pridajte nasledujúci atribút do buniek tabuľky, ktoré chcete centrovať:

class = "centrovaná bunka" >

Potom pridajte do svojho štýlu hárkov:

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

Túto triedu môžete pridať do ľubovoľnej bunky v tabuľke.

Zbaliť

Neváhajte používať tieto štýly na ľubovoľnej bunke tabuľky. Môžete ich použiť na zlúčené bunky alebo na jednotlivé bunky a text v nich bude sústredený.