Comment ajouter un espacement entre les lignes d'un tableau sans utiliser l'espacement des bordures ?

Espacement des lignes dans un tableau

L'ajout d'un espacement vertical entre les lignes du tableau améliore la lisibilité et l'attrait visuel. Bien que border-spacing puisse sembler être la propriété idéale à cet effet, elle n'affecte que l'espacement entre les cellules du tableau. Pour obtenir l'espacement des lignes, nous devons explorer des solutions alternatives.

La clé réside dans l'ajustement du remplissage des cellules de données individuelles du tableau (éléments ). Voici une solution CSS :

tr.spaceUnder > td {
  padding-bottom: 1em;
}

Dans ce code, nous ciblons les enfants directs (>) des lignes du tableau avec la classe "spaceUnder". Cela permet un espacement sélectif, ce qui peut être utile dans les scénarios de tableaux imbriqués.

La propriété "padding-bottom" définit l'espacement vertical sous le contenu de la cellule. Ajustez cette valeur comme vous le souhaitez pour obtenir l'espacement des rangées préféré. En remplissant le bas de la cellule, nous créons effectivement un espace entre la cellule et la ligne située en dessous.

Ainsi, même si l'espacement des bordures n'est pas applicable dans ce cas, le remplissage constitue un moyen efficace de contrôler l'espacement des lignes. dans les tableaux.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!