empty-cells
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
La propriété empty-cells
définit la façon dont l'agent utilisateur doit afficher les bordures et l'arrière-plan des cellules d'un tableau (<table>
) qui n'ont aucun contenu visible.
Exemple interactif
Cette propriété est uniquement appliquée lorsque border-collapse
vaut separate
.
Syntaxe
css
/* Valeurs avec mot-clé */
empty-cells: show;
empty-cells: hide;
/* Valeurs globales */
empty-cells: inherit;
empty-cells: initial;
empty-cells: unset;
Cette propriété se définit avec l'un des mots-clés suivants.
Valeurs
Définition formelle
Valeur initiale | show |
---|---|
Applicabilité | éléments qui sont des cellules de tableau |
Héritée | oui |
Valeur calculée | comme spécifié |
Type d'animation | discrète |
Syntaxe formelle
empty-cells =
show |
hide
Exemples
HTML
html
<table class="table_1">
<tr>
<td>Jean</td>
<td>Biche</td>
</tr>
<tr>
<td>Alice</td>
<td></td>
</tr>
</table>
<table class="table_2">
<tr>
<td>Jean</td>
<td>Biche</td>
</tr>
<tr>
<td>Alice</td>
<td></td>
</tr>
</table>
CSS
css
.table_1 {
empty-cells: show;
}
.table_2 {
empty-cells: hide;
}
td,
th {
border: 1px solid #999;
padding: 0.5rem;
}
Résultat
Spécifications
Specification |
---|
Cascading Style Sheets Level 2 Revision 2 (CSS 2.2) Specification # empty-cells |
Compatibilité des navigateurs
BCD tables only load in the browser