caption-side касиети

caption-side касиети <caption> теги менен түзүлгөн таблицанын наамасынын ордун белгилейт. Касиеттин эки мааниси болушу мүмкүн: top (таблицанын үстүндө, демейкиде) же bottom (таблицанын астында).

Синтаксис

cssтандоочу {
  caption-side: top | bottom;
}

Мисал

Келгиле, нааманы таблицанын үстүнө жайгаштыралы:

html<table border="1" width="300">
  <caption>Table</caption>
  <tr>
    <th>Head</th>
    <th>Description</th>
  </tr>
  <tr>
    <td>text1</td>
    <td>text2</td>
  </tr>
</table>
csstable {
  width: 100%;
  border-collapse: collapse;
}
td {
  width: 200px;
  height: 100px;
  text-align: center;
}
caption {
  caption-side: top;
  font-weight: bold;
}

Результат:

Мисал

Эми нааманы таблицанын астына жылдыралы:

html<table border="1" width="300">
  <caption>Table</caption>
  <tr>
    <th>Head</th>
    <th>Description</th>
  </tr>
  <tr>
    <td>text1</td>
    <td>text2</td>
  </tr>
</table>
csstable {
  width: 100%;
  border-collapse: collapse;
}
td {
  width: 200px;
  height: 100px;
  text-align: center;
}
caption {
  caption-side: bottom;
  font-weight: bold;
}

Результат:

Ошондой эле караңыз

  • bottom касиети,
    элементтин төмөнкү четинен ордун белгилейт
  • top касиети,
    элементтин жогорку четинен ордун белгилейт
  • left касиети,
    элементтин сол четинен ордун белгилейт
  • right касиети,
    элементтин он четинен ордун белгилейт
  • ::backdrop жалган элемент,
    биринчи элементтен кийинки жайгашуусун белгилейт