Si vous êtes un concepteur Web novice, vous vous posez peut-être des questions sur la manière de centrer le texte à l'intérieur d'une cellule de tableau. Avec ce guide, apprenez cette technique en quelques minutes seulement. C'est facile - même si vous n'avez jamais essayé auparavant.
Commencer
Centrage du texte à l'intérieur d'une cellule est mieux fait avec CSS, tout comme vous centreriez du texte dans un autre élément de votre page Web. Avant de commencer, cependant, vous devez décider sur quoi exactement vous voulez être centré. Avec un tableau, vous avez plusieurs options, y compris chaque cellule du tableau; chaque cellule d'en-tête du tableau chaque cellule de l'en-tête, du corps du tableau ou du pied du tableau. Vous pouvez également centrer une cellule spécifique ou un ensemble de cellules dans le tableau.
De plus, vous devez créer un feuille de style interne dans l'en-tête de votre document ou joint au document en tant que feuille de style externe. Vous allez mettre les styles pour centrer les cellules de votre tableau dans cette feuille de style.
Comment centrer chaque cellule du tableau
Ajoutez les lignes suivantes à votre feuille de style:
td, th {
text-align: centre ;
}
Comment centrer chaque cellule d'en-tête dans le tableau
Ajoutez les lignes suivantes à votre feuille de style:
e {
text-align: centre ;
}
Centrage de chaque cellule de la tête, du corps ou du pied du tableau
Afin de centrer ces cellules, vous devez ajouter des balises de tableau qui ne sont pas toujours utilisées, telles que.
thead th, thead td {
text-align: centre ;
}
tcorps th, tcorps td {
text-align: centre ;
}
tfoot th, tfoot td {
text-align: centre ;
}
Supprimez les styles des zones que vous ne souhaitez pas centrer.
Comment centrer une ou plusieurs cellules spécifiques dans un tableau
Pour ce faire, vous devez définir une classe sur les cellules que vous souhaitez centrer.
Ajoutez l'attribut suivant aux cellules du tableau que vous souhaitez centrer:
Ajoutez ensuite les éléments suivants à votre feuille de style:
.cellule centrée {
text-align: centre ;
}
Vous pouvez ajouter cette classe à n'importe quelle cellule de votre tableau.
Emballer
N'hésitez pas à utiliser ces styles sur l'une des cellules de votre tableau. Vous pouvez les utiliser sur des cellules fusionnées ou sur des cellules individuelles et le texte à l'intérieur sera centré.