empty-cells |
Cellules vide |
CSS2 |
|
Syntaxe
empty-cells: hide|inherit|initial|show;
|
Paramètres
Paramètre |
Description |
hide |
Ce paramètre permet d'indiquer qu'il ne faut pas afficher l'arrière-plan ou la bordure quand c'est une cellule vide. |
inherit |
Ce paramètre permet d'indiquer qu'il faut hérité de la valeur de son parent. |
initial |
Ce paramètre permet d'indiquer qu'il faut appliquer la valeur par défaut de cette propriété. |
show |
Ce paramètre permet d'indiquer qu'il faut afficher l'arrière-plan et la bordure quand c'est une cellule vide. C'est la valeur par défaut. |
Description
Cette propriété permet d'indiquer s'il faut afficher ou non les bordures et l'arrière-plan sur les cellules vides d'un tableau.
Remarques
- Fonctionnalité principale : La propriété empty-cells permet de définir si les bordures et le fond des cellules de tableau vides doivent être affichés
ou non. Elle est utile pour gérer l'apparence des tableaux lorsque certaines cellules n'ont pas de contenu, améliorant ainsi l'esthétique et la lisibilité.
- Impact sur les bordures : Avec empty-cells: hide;, les bordures des cellules vides ne sont pas visibles, ce qui peut créer des espaces irréguliers dans
les tableaux si les bordures adjacentes ne s'alignent pas correctement. Cela peut nécessiter des ajustements supplémentaires dans le style du tableau.
- Compatibilité et limitations : La propriété empty-cells est prise en charge par la plupart des navigateurs modernes, mais elle peut être ignorée si
d'autres styles (comme des images de fond ou des pseudo-éléments) sont appliqués aux cellules vides. Cela peut entraîner des incohérences dans le rendu.
- Influence sur la structure des tableaux : Même avec empty-cells: hide;, les cellules vides restent présentes dans la structure du tableau
HTML. Elles sont seulement masquées visuellement, ce qui signifie que leur impact sur l'alignement des lignes et des
colonnes persiste.
- Utilisation dans des tableaux dynamiques : Cette propriété est particulièrement utile pour les tableaux générés dynamiquement, comme ceux utilisés dans
des interfaces utilisateur ou des tableaux de données, afin de masquer les cellules non remplies sans supprimer manuellement leur contenu.
- Effet sur l'accessibilité : Bien que empty-cells: hide; masque visuellement les cellules vides, ces dernières sont toujours détectables par les
technologies d'assistance, comme les lecteurs d'écran. Cela garantit que la structure complète du tableau reste compréhensible pour tous les utilisateurs.
- Design et esthétique : Dans des designs épurés, utiliser empty-cells: hide; permet de supprimer les éléments inutiles et de rendre les tableaux
plus propres visuellement. Cependant, dans des tableaux complexes ou bordés, il peut être préférable d'utiliser empty-cells: show; pour maintenir une cohérence
visuelle.
Dernière mise à jour : Dimanche, le 20 décembre 2015