Таблицы
Утилиты для управления выравниванием элемента подписи внутри таблицы.
| Class | Styles |
|---|---|
caption-top | caption-side: top; |
caption-bottom | caption-side: bottom; |
Используйте утилиту caption-top для позиционирования элемента подписи в верхней части таблицы:
| Рестлер | Фирменный прием(ы) |
|---|---|
| "Stone Cold" Стив Остин | Stone Cold Stunner, Lou Thesz Press |
| Брет "Хитмен" Харт | The Sharpshooter |
| Razor Ramon | Razor's Edge, Fallaway Slam |
<table> <caption class="caption-top"> Таблица 3.1: Профессиональные рестлеры и их фирменные приемы. </caption> <thead> <tr> <th>Рестлер</th> <th>Фирменный прием(ы)</th> </tr> </thead> <tbody> <tr> <td>"Stone Cold" Стив Остин</td> <td>Stone Cold Stunner, Lou Thesz Press</td> </tr> <tr> <td>Брет "Хитмен" Харт</td> <td>The Sharpshooter</td> </tr> <tr> <td>Razor Ramon</td> <td>Razor's Edge, Fallaway Slam</td> </tr> </tbody></table>Используйте утилиту caption-bottom для позиционирования элемента подписи в нижней части таблицы:
| Рестлер | Фирменный прием(ы) |
|---|---|
| "Stone Cold" Стив Остин | Stone Cold Stunner, Lou Thesz Press |
| Брет "Хитмен" Харт | The Sharpshooter |
| Razor Ramon | Razor's Edge, Fallaway Slam |
<table> <caption class="caption-bottom"> Таблица 3.1: Профессиональные рестлеры и их фирменные приемы. </caption> <thead> <tr> <th>Рестлер</th> <th>Фирменный прием(ы)</th> </tr> </thead> <tbody> <tr> <td>"Stone Cold" Стив Остин</td> <td>Stone Cold Stunner, Lou Thesz Press</td> </tr> <tr> <td>Брет "Хитмен" Харт</td> <td>The Sharpshooter</td> </tr> <tr> <td>Razor Ramon</td> <td>Razor's Edge, Fallaway Slam</td> </tr> </tbody></table>Префикс a caption-side утилита с вариантом контрольной точки, например md:, чтобы применить утилиту только при размерах экрана medium и выше:
<caption class="caption-top md:caption-bottom ..."> <!-- ... --></caption>Подробнее об использовании вариантов читайте в документации по вариантам.