caption-side hassaýaty

caption-side hassaýaty <caption> tegi bilen döredilen tabilasanyň sözbaşynyň ýerleşişini kesgitleýär. Hassaýatyň iki sany bahasy bolup biler: top (tabilasanyň ýokarsynda, deslapky ýagdaýy) ýa-da bottom (tabilasanyň aşagynda).

Sintaksis

cssselektor {
  caption-side: top | bottom;
}

Mysal

Geliň, sözbaşy tablisanyň ýokarsynda ýerleşdireliň:

html<table border="1" width="300">
  <caption>Tabilasa</caption>
  <tr>
    <th>Sözbaşy</th>
    <th>Düşündiriş</th>
  </tr>
  <tr>
    <td>tekst1</td>
    <td>tekst2</td>
  </tr>
</table>
csstable {
  width: 100%;
  border-collapse: collapse;
}
td {
  width: 200px;
  height: 100px;
  text-align: center;
}
caption {
  caption-side: top;
  font-weight: bold;
}

Результат:

Mysal

Indi bolsa, sözbaşy tablisanyň aşagyna geçireliň:

html<table border="1" width="300">
  <caption>Tabilasa</caption>
  <tr>
    <th>Sözbaşy</th>
    <th>Düşündiriş</th>
  </tr>
  <tr>
    <td>tekst1</td>
    <td>tekst2</td>
  </tr>
</table>
csstable {
  width: 100%;
  border-collapse: collapse;
}
td {
  width: 200px;
  height: 100px;
  text-align: center;
}
caption {
  caption-side: bottom;
  font-weight: bold;
}

Результат:

Şeýle-de görüň

  • bottom hassaýaty,
    elementiň aşaky gyrasynyň pozisiýasyny kesgitleýär
  • top hassaýaty,
    elementiň ýokarky gyrasynyň pozisiýasyny kesgitleýär
  • left hassaýaty,
    elementiň çep gyrasynyň pozisiýasyny kesgitleýär
  • right hassaýaty,
    elementiň sag gyrasynyň pozisiýasyny kesgitleýär
  • ::backdrop psewdolement,
    bir-inji elementden soňky ýerleşişi kesgitleýär