Egenskaben empty-cells

Egenskaben empty-cells angiver til browseren, hvordan baggrund og ramme af tomme celler td eller celler th i en HTML tabel skal vises: om de skal vises eller ej.

En celle betragtes som tom i følgende tilfælde: der er ingen tegn overhovedet, cellen indeholder kun mellemrum (et eller flere), linjeskift eller tabulatortegn, eller hvis egenskaben visibility er sat til hidden.

For at gøre en celle ikke-tom, men alligevel uden synlig tekst, anvendes følgende trick: man indsætter et hårdt mellemrum   i cellen.

Egenskaben virker ikke, hvis border-collapse er sat til værdien collapse.

Syntaks

cssselektor {
  empty-cells: show | hide;
}

Værdier

Standardværdi: show.

Eksempel . Værdien show

Lige nu i tabellen er nogle celler tomme, men de har alligevel ramme og baggrund:

html<table>
  <tr>
    <td>celle</td>
    <td></td>
    <td>celle</td>
  </tr>
  <tr>
    <td></td>
    <td>celle</td>
    <td></td>
  </tr>
  <tr>
    <td>celle</td>
    <td>celle</td>
    <td>celle</td>
  </tr>
</table>

csstable {
  width: 400px;
  empty-cells: show;
}
td {
  border: 1px solid black;
  background-color: #f3f3f3;
  text-align: center;
}

Результат:

Eksempel . Værdien hide

Men nu vil de tomme celler ikke have baggrund og ramme:

html<table>
  <tr>
    <td>celle</td>
    <td></td>
    <td>celle</td>
  </tr>
  <tr>
    <td></td>
    <td>celle</td>
    <td></td>
  </tr>
  <tr>
    <td>celle</td>
    <td>celle</td>
    <td>celle</td>
  </tr>
</table>

csstable {
  width: 400px;
  empty-cells: hide;
}
td {
  border: 1px solid black;
  background-color: #f3f3f3;
  text-align: center;
}

Результат:

Se også