Eienskap caption-side

Die eienskap caption-side stel die posisie van 'n tabel se byskrif, geskep met die etiket <caption>. Die eienskap het twee moontlike waardes: top (bo-aan die tabel, verstek) of bottom (onder die tabel).

Sintaksis

cssselektor {
  caption-side: top | bottom;
}

Voorbeeld

Kom ons plaas die byskrif bo die tabel:

html<table border="1" width="300">
  <caption>Tabel</caption>
  <tr>
    <th>Kop</th>
    <th>Beskrywing</th>
  </tr>
  <tr>
    <td>teks1</td>
    <td>teks2</td>
  </tr>
</table>
csstable {
  width: 100%;
  border-collapse: collapse;
}
td {
  width: 200px;
  height: 100px;
  text-align: center;
}
caption {
  caption-side: top;
  font-weight: bold;
}

Результат:

Voorbeeld

En nou, laat ons die byskrif onder die tabel sit:

html<table border="1" width="300">
  <caption>Tabel</caption>
  <tr>
    <th>Kop</th>
    <th>Beskrywing</th>
  </tr>
  <tr>
    <td>teks1</td>
    <td>teks2</td>
  </tr>
</table>
csstable {
  width: 100%;
  border-collapse: collapse;
}
td {
  width: 200px;
  height: 100px;
  text-align: center;
}
caption {
  caption-side: bottom;
  font-weight: bold;
}

Результат:

Sien ook

  • eienskap bottom,
    wat die posisie van 'n element se onderste kant stel
  • eienskap top,
    wat die posisie van 'n element se boonste kant stel
  • eienskap left,
    wat die posisie van 'n element se linkerkant stel
  • eienskap right,
    wat die posisie van 'n element se regterkant stel
  • pseudoelement ::backdrop,
    wat die rangskikking na die eerste element stel