Sut i Ganolfan Testun mewn Cell Tabl

Os ydych chi'n ddylunydd Gwe newyddiadur, efallai y bydd gennych gwestiynau ynghylch sut i ganolbwyntio testun y tu mewn i gell bwrdd. Gyda'r canllaw hwn, meistr y dechneg hon mewn ychydig funudau. Mae'n hawdd - hyd yn oed os nad ydych erioed wedi ceisio cyn.

Dechrau arni

Y ffordd orau o wneud testun canoli y tu mewn i gell gyda CSS, yn union fel y byddech yn canu testun mewn elfen arall ar eich tudalen We. Cyn i chi ddechrau, fodd bynnag, mae angen i chi benderfynu beth yn union rydych chi am ei ganoli. Gyda thabl, mae gennych nifer o opsiynau, gan gynnwys pob cell yn y tabl; pob cell pennawd yn y bwrdd pob cell yn y pen bwrdd, corff y bwrdd neu droed bwrdd. Efallai y byddwch hefyd yn canoli celloedd penodol neu set o gelloedd yn y tabl.

Yn ogystal, dylech greu dalen arddull fewnol ym mhennaeth eich dogfen neu ynghlwm wrth y ddogfen fel dalen arddull allanol . Byddwch yn gosod yr arddulliau i ganol eich celloedd bwrdd yn y daflen arddull honno.

Sut i Ganolbwyntio Pob Cell yn y Tabl

Ychwanegwch y llinellau canlynol i'ch dalen arddull:

td, th {alinio testun: canolfan; }

Sut i Ganolbwyntio Pob Cen Pennawd yn y Tabl

Ychwanegwch y llinellau canlynol i'ch dalen arddull:

th {alinio testun: canolfan; }

Canolbwyntio Pob Cell yn y Pennaeth, y Corff neu'r Traed Tabl

Er mwyn canoli'r celloedd hyn, mae angen i chi ychwanegu tagiau tabl nad ydynt bob amser yn cael eu defnyddio, fel , a . Yna, byddwch yn amgylchynu'ch celloedd bwrdd gyda'r tagiau hyn i nodi pen y bwrdd, y corff, a'r droed. Wedi hynny, byddwch chi'n ychwanegu'r canlynol at eich dalen arddull:

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

Dileu'r arddulliau ar gyfer yr ardaloedd nad ydych am eu canolbwyntio.

Sut i Ganoli Celloedd neu Gelloedd Penodol mewn Tabl

I wneud hyn, mae angen i chi osod dosbarth ar y celloedd rydych chi am ganolbwyntio arnynt.

Ychwanegwch y priodwedd canlynol i'r celloedd bwrdd yr ydych am eu canoli:

class = "centered-cell" >

Yna, ychwanegwch y canlynol i'ch dalen arddull:

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

Gallwch chi ychwanegu'r dosbarth hwn i unrhyw gell yn eich bwrdd.

Ymdopio

Peidiwch ag oedi cyn defnyddio'r arddulliau hyn ar unrhyw un o'ch celloedd bwrdd. Gallwch eu defnyddio ar gelloedd cyfun neu ar gelloedd sengl a bydd y testun o fewn yn cael ei ganoli.