Skip to content

Como centralizar texto em uma célula de tabela

15 de junho de 2021

Se você for um Web designer novato, pode ter dúvidas sobre como centralizar o texto dentro de uma célula de tabela. Com este guia, aprenda esta técnica em apenas alguns minutos. É fácil – mesmo se você nunca tentou antes.

Começando

Centralizar o texto dentro de uma célula é melhor feito com CSS, da mesma forma que você centralizaria o texto em outro elemento em sua página da web. Antes de começar, entretanto, você precisa decidir o que exatamente deseja ser centrado. Com uma tabela, você tem várias opções, incluindo todas as células da tabela; todas as células de cabeçalho da tabela todas as células do cabeçalho, corpo ou pé da mesa. Você também pode centralizar uma célula específica ou um conjunto de células na tabela. Além disso, você deve criar uma folha de estilo interna no cabeçalho do documento ou anexada ao documento como uma folha de estilo externa. Você colocará os estilos para centralizar as células da tabela nessa folha de estilo.

Como centralizar cada célula na mesa

Adicione as seguintes linhas à sua folha de estilo: td, th {
alinhamento de texto: centro;
}

Como centralizar cada célula de cabeçalho na tabela

Adicione as seguintes linhas à sua folha de estilo: th {
alinhamento de texto: centro;
}

Centrando cada célula na cabeça, corpo ou pé da mesa

Para centralizar essas células, você precisa adicionar tags de tabela que nem sempre são usadas, como thead th, thead td {
alinhamento de texto: centro;
}
tbody th, tbody td {
alinhamento de texto: centro;
}
tfoot th, tfoot td {
alinhamento de texto: centro;
}

Remova os estilos das áreas que você não deseja centralizar.

Como centralizar uma célula ou células específicas em uma tabela

Para fazer isso, você precisa definir uma classe nas células que deseja centralizar. Adicione o seguinte atributo às células da tabela que você deseja centralizar:

Em seguida, adicione o seguinte à sua folha de estilo: .centered-cell {
alinhamento de texto: centro;
}

Você pode adicionar esta classe a qualquer célula da sua tabela.

Empacotando

Não hesite em usar esses estilos em qualquer uma das células da tabela. Você pode usá-los em células mescladas ou em células individuais e o texto dentro será centralizado.

Formato mla apa chicago Sua Citação

Kyrnin, Jennifer. “Como centralizar texto em uma célula de tabela.” ThoughtCo, 10 de junho de 2021, thinkingco.com/center-text-in-table-cell-3469873.
Kyrnin, Jennifer. (2021, 10 de junho). Como centralizar texto em uma célula de tabela. Obtido em https://www.thoughtco.com/center-text-in-table-cell-3469873
Kyrnin, Jennifer. “Como centralizar texto em uma célula de tabela.” ThoughtCo. https://www.thoughtco.com/center-text-in-table-cell-3469873 (acessado em 15 de junho de 2021).