テーブル

Example

• テーブルには .table クラスを付与します。
• .is-outlined クラスを付与すると、枠付きになります。

レスポンシブ

.table-container で囲むと、画面幅が狭まったとき、テーブルが横にスクロールします。

.is-mobile-stacked クラスを付与すると、モバイル幅で、セルが縦に積まれます。

行のハイライト

• .is-hoverable クラスを付与すると、マウスオーバーした行をハイライトします。
• <tr> 要素 に .row-danger クラスを付与すると、エラーを示す表示になります。

セル幅を最小化する

.cell-minimum クラスを付与したセルは、幅がコンテンツの幅まで縮まります。

行間の狭いテーブル

.is-narrow クラスを付与すると、行間の狭いシンプルな表示が適用されます。

定義テーブル

ヘッダーと値が一行に並ぶタイプの定義テーブルを表現するには、.is-definition クラスを付与します。