Paras tapa keskittää teksti taulukon soluun

click fraud protection

Jos olet aloitteleva verkkosuunnittelija, sinulla saattaa olla kysyttävää tekstin keskittämisestä taulukon solun sisään. Opi tämä opas tämän oppaan avulla muutamassa minuutissa. Se on helppoa - vaikka et ole koskaan ennen yrittänyt.

Päästä alkuun

Keskittävä teksti solun sisällä on parasta tehdä CSS: llä, aivan kuten keskität tekstin Web-sivusi toiseen elementtiin. Ennen kuin aloitat, sinun on kuitenkin päätettävä, mitä haluat keskittää. Taulukon kanssa sinulla on useita vaihtoehtoja, mukaan lukien kaikki taulukon solut; jokainen taulukon otsikkosolu jokainen taulukon pään, pöydän rungon tai pöydän jalan solu. Voit myös keskittää tietyn solun tai soluryhmän taulukkoon.

Lisäksi sinun tulisi luoda sisäinen tyyli asiakirjan päähän tai liitetään asiakirjaan ulkoinen tyyli. Asetat tyylit keskittämään taulukon solut kyseiseen tyylitaulukkoon.

Kuinka keskittää taulukon kaikki solut

Lisää seuraavat rivit tyylisivullesi:

td, th {
tekstin tasaus: keskellä;
}

Kuinka keskittää taulukon jokainen otsikkosolu

instagram viewer

Lisää seuraavat rivit tyylisivullesi:

th {
tekstin tasaus: keskellä;
}

Keskitä kaikki solut pöydän päähän, vartaloon tai jalkaan

Näiden solujen keskittämiseksi sinun on lisättävä taulukotunnisteita, joita ei aina käytetä, kuten.

thead th, thead td {
tekstin tasaus: keskellä;
}
tbody th, tbody td {
tekstin tasaus: keskellä;
}
tfoot th, tfoot td {
tekstin tasaus: keskellä;
}

Poista niiden alueiden tyylit, joita et halua keskittää.

Tietyn solun tai solujen keskittäminen taulukkoon

Tätä varten sinun on asetettava luokka soluihin, jotka haluat keskittää.

Lisää seuraava attribuutti taulukkosoluihin, jotka haluat keskittää:

Lisää sitten seuraava tyylisivullesi:

.centered-cell {
tekstin tasaus: keskellä;
}

Voit lisätä tämän luokan mihin tahansa taulukon soluun.

Käärimistä

Älä epäröi käyttää näitä tyylejä missään taulukon solussa. Voit käyttää niitä yhdistetyissä soluissa tai yksittäisissä soluissa, ja sisällä oleva teksti keskitetään.

instagram story viewer