Hvis du er en nybegynner-webdesigner, kan du ha spørsmål om hvordan du sentrerer teksten inne i en tabellcelle. Lær denne teknikken på få minutter med denne guiden. Det er enkelt - selv om du aldri har prøvd det før.
Starter
Sentreringstekst innsiden av en celle gjøres best med CSS, akkurat som du sentrerer tekst i et annet element på websiden din. Før du begynner, må du imidlertid bestemme hva du vil være sentrert. Med en tabell har du flere alternativer, inkludert hver celle i tabellen; hver topptekstcelle i tabellen hver celle i bordhodet, bordkroppen eller bordfoten. Du kan også sentrere en bestemt celle eller et sett med celler i tabellen.
I tillegg bør du opprette en internt stilark i hodet på dokumentet eller vedlagt dokumentet som en eksternt stilark. Du vil sette stilene for å sentrere tabellcellene i det stilarket.
Slik sentrerer du alle celler i tabellen
Legg til følgende linjer i stilarket ditt:
td, th {
tekstjustering: sentrum;
}
Slik sentrerer du hver topptekstcelle i tabellen
Legg til følgende linjer i stilarket ditt:
th {
tekstjustering: sentrum;
}
Sentrere hver celle i bordhodet, kroppen eller foten
For å sentrere disse cellene, må du legge til tabellkoder som ikke alltid brukes, for eksempel.
thead th, thead td {
tekstjustering: sentrum;
}
tbody th, tbody td {
tekstjustering: sentrum;
}
tfoot th, tfoot td {
tekstjustering: sentrum;
}
Fjern stilene for områdene du ikke vil være sentrert.
Hvordan sentrere en bestemt celle eller celler i en tabell
For å gjøre dette må du sette en klasse på cellene du vil være sentrert.
Legg til følgende attributt i tabellcellene du vil være sentrert:
Legg deretter til følgende i stilarket ditt:
.centrert-celle {
tekstjustering: sentrum;
}
Du kan legge til denne klassen i en hvilken som helst celle i tabellen din.
Innpakning
Ikke nøl med å bruke disse stilene på noen av bordcellene dine. Du kan bruke dem på sammenslåtte celler eller på enkeltceller, og teksten i vil være sentrert.