Īpašība empty-cells

Īpašība empty-cells norāda pārlūkprogrammai kā attēlot fonu un apmali tukšām šūnām td vai šūnām th HTML tabulā: rādīt vai nerādīt.

Šūna tiek uzskatīta par tukšu šādos gadījumos: nav vispār nekādu simbolu, šūnā ir tikai atstarpes (viena vai vairākas), rindas pārnešana vai tabulācijas simbols, vai arī īpašība visibility ir iestatīta kā hidden.

Lai padarītu šūnu par ne tukšu, bet tajā pašā laikā bez redzama teksta, izmanto šādu paņēmienu: šūnā ieraksta nepārraujamu atstarpi  .

Īpašība nedarbojas, ja ir iestatīts border-collapse ar vērtību collapse.

Sintakse

cssselektors {
  empty-cells: show | hide;
}

Vērtības

Noklusējuma vērtība: show.

Piemērs . Vērtība show

Pašlaik tabulā dažas šūnas ir tukšas, bet tām joprojām ir apmale un fons:

html<table>
  <tr>
    <td>šūna</td>
    <td></td>
    <td>šūna</td>
  </tr>
  <tr>
    <td></td>
    <td>šūna</td>
    <td></td>
  </tr>
  <tr>
    <td>šūna</td>
    <td>šūna</td>
    <td>šūna</td>
  </tr>
</table>

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

Результат:

Piemērs . Vērtība hide

Bet tagad tukšajām šūnām nebūs fona un apmales:

html<table>
  <tr>
    <td>šūna</td>
    <td></td>
    <td>šūna</td>
  </tr>
  <tr>
    <td></td>
    <td>šūna</td>
    <td></td>
  </tr>
  <tr>
    <td>šūna</td>
    <td>šūna</td>
    <td>šūna</td>
  </tr>
</table>

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

Результат:

Skatiet arī