表

特殊なセルを持つ、避けられない HTML テーブル

次の構造を持つ<table> HTML 要素に単一のtable CSS クラスを付加するだけで、Bulma テーブルを作成できます。

<table class="table"> をメインのコンテナとして
- thead テーブルのオプションの上部
- tfoot テーブルのオプションの下部
- tbody テーブルのメインコンテンツ
  - tr 各テーブル行
    - th テーブルセルの見出し
    - td テーブルセル

<tr> にis-selected 修飾子を付加することで、テーブル行を選択済みとして設定できます。

例

順位	チーム	試合数	勝	分	敗	得点	失点	得失点差	勝ち点	予選または降格
順位	チーム	試合数	勝	分	敗	得点	失点	得失点差	勝ち点	予選または降格
1	レスター・シティ (優勝)	38	23	12	3	68	36	+32	81	チャンピオンズリーググループステージへの出場権
2	アーセナル	38	20	11	7	65	36	+29	71	チャンピオンズリーググループステージへの出場権
3	トッテナム・ホットスパー	38	19	13	6	69	35	+34	70	チャンピオンズリーググループステージへの出場権
4	マンチェスター・シティ	38	19	9	10	71	41	+30	66	チャンピオンズリーグプレーオフラウンドへの出場権
5	マンチェスター・ユナイテッド	38	19	9	10	49	35	+14	66	ヨーロッパリーググループステージへの出場権
6	サウサンプトン	38	18	9	11	59	41	+18	63	ヨーロッパリーググループステージへの出場権
7	ウェストハム・ユナイテッド	38	16	14	8	65	51	+14	62	ヨーロッパリーグ3次予選への出場権
8	リヴァプール	38	16	12	10	63	50	+13	60
9	ストーク・シティ	38	14	9	15	41	55	-14	51
10	チェルシー	38	12	14	12	59	53	+6	50
11	エヴァートン	38	11	14	13	59	55	+4	47
12	スウォンジー・シティ	38	12	11	15	42	52	-10	47
13	ワトフォード	38	12	9	17	40	50	-10	45
14	ウェストブロムウィッチ・アルビオン	38	10	13	15	34	48	-14	43
15	クリスタル・パレス	38	11	9	18	39	51	-12	42
16	AFCボーンマス	38	11	9	18	45	67	-22	42
17	サンダーランド	38	9	12	17	48	62	-14	39
18	ニューカッスル・ユナイテッド (降格)	38	9	10	19	44	65	-21	37	フットボールリーグチャンピオンシップへの降格
19	ノリッジ・シティ (降格)	38	9	7	22	39	67	-28	34	フットボールリーグチャンピオンシップへの降格
20	アストン・ヴィラ (降格)	38	3	8	27	27	76	-49	17	フットボールリーグチャンピオンシップへの降格

HTML

<table class="table">
  <thead>
    <tr>
      <th><abbr title="Position">Pos</abbr></th>
      <th>Team</th>
      <th><abbr title="Played">Pld</abbr></th>
      <th><abbr title="Won">W</abbr></th>
      <th><abbr title="Drawn">D</abbr></th>
      <th><abbr title="Lost">L</abbr></th>
      <th><abbr title="Goals for">GF</abbr></th>
      <th><abbr title="Goals against">GA</abbr></th>
      <th><abbr title="Goal difference">GD</abbr></th>
      <th><abbr title="Points">Pts</abbr></th>
      <th>Qualification or relegation</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th><abbr title="Position">Pos</abbr></th>
      <th>Team</th>
      <th><abbr title="Played">Pld</abbr></th>
      <th><abbr title="Won">W</abbr></th>
      <th><abbr title="Drawn">D</abbr></th>
      <th><abbr title="Lost">L</abbr></th>
      <th><abbr title="Goals for">GF</abbr></th>
      <th><abbr title="Goals against">GA</abbr></th>
      <th><abbr title="Goal difference">GD</abbr></th>
      <th><abbr title="Points">Pts</abbr></th>
      <th>Qualification or relegation</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <th>1</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Leicester_City_F.C."
          title="Leicester City F.C."
          >Leicester City</a
        >
        <strong>(C)</strong>
      </td>
      <td>38</td>
      <td>23</td>
      <td>12</td>
      <td>3</td>
      <td>68</td>
      <td>36</td>
      <td>+32</td>
      <td>81</td>
      <td>
        Qualification for the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"
          title="2016–17 UEFA Champions League"
          >Champions League group stage</a
        >
      </td>
    </tr>
    <tr>
      <th>2</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Arsenal_F.C."
          title="Arsenal F.C."
          >Arsenal</a
        >
      </td>
      <td>38</td>
      <td>20</td>
      <td>11</td>
      <td>7</td>
      <td>65</td>
      <td>36</td>
      <td>+29</td>
      <td>71</td>
      <td>
        Qualification for the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"
          title="2016–17 UEFA Champions League"
          >Champions League group stage</a
        >
      </td>
    </tr>
    <tr>
      <th>3</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Tottenham_Hotspur_F.C."
          title="Tottenham Hotspur F.C."
          >Tottenham Hotspur</a
        >
      </td>
      <td>38</td>
      <td>19</td>
      <td>13</td>
      <td>6</td>
      <td>69</td>
      <td>35</td>
      <td>+34</td>
      <td>70</td>
      <td>
        Qualification for the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"
          title="2016–17 UEFA Champions League"
          >Champions League group stage</a
        >
      </td>
    </tr>
    <tr class="is-selected">
      <th>4</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Manchester_City_F.C."
          title="Manchester City F.C."
          >Manchester City</a
        >
      </td>
      <td>38</td>
      <td>19</td>
      <td>9</td>
      <td>10</td>
      <td>71</td>
      <td>41</td>
      <td>+30</td>
      <td>66</td>
      <td>
        Qualification for the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Play-off_round"
          title="2016–17 UEFA Champions League"
          >Champions League play-off round</a
        >
      </td>
    </tr>
    <tr>
      <th>5</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Manchester_United_F.C."
          title="Manchester United F.C."
          >Manchester United</a
        >
      </td>
      <td>38</td>
      <td>19</td>
      <td>9</td>
      <td>10</td>
      <td>49</td>
      <td>35</td>
      <td>+14</td>
      <td>66</td>
      <td>
        Qualification for the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage"
          title="2016–17 UEFA Europa League"
          >Europa League group stage</a
        >
      </td>
    </tr>
    <tr>
      <th>6</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Southampton_F.C."
          title="Southampton F.C."
          >Southampton</a
        >
      </td>
      <td>38</td>
      <td>18</td>
      <td>9</td>
      <td>11</td>
      <td>59</td>
      <td>41</td>
      <td>+18</td>
      <td>63</td>
      <td>
        Qualification for the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage"
          title="2016–17 UEFA Europa League"
          >Europa League group stage</a
        >
      </td>
    </tr>
    <tr>
      <th>7</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/West_Ham_United_F.C."
          title="West Ham United F.C."
          >West Ham United</a
        >
      </td>
      <td>38</td>
      <td>16</td>
      <td>14</td>
      <td>8</td>
      <td>65</td>
      <td>51</td>
      <td>+14</td>
      <td>62</td>
      <td>
        Qualification for the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Third_qualifying_round"
          title="2016–17 UEFA Europa League"
          >Europa League third qualifying round</a
        >
      </td>
    </tr>
    <tr>
      <th>8</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Liverpool_F.C."
          title="Liverpool F.C."
          >Liverpool</a
        >
      </td>
      <td>38</td>
      <td>16</td>
      <td>12</td>
      <td>10</td>
      <td>63</td>
      <td>50</td>
      <td>+13</td>
      <td>60</td>
      <td></td>
    </tr>
    <tr>
      <th>9</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Stoke_City_F.C."
          title="Stoke City F.C."
          >Stoke City</a
        >
      </td>
      <td>38</td>
      <td>14</td>
      <td>9</td>
      <td>15</td>
      <td>41</td>
      <td>55</td>
      <td>−14</td>
      <td>51</td>
      <td></td>
    </tr>
    <tr>
      <th>10</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Chelsea_F.C."
          title="Chelsea F.C."
          >Chelsea</a
        >
      </td>
      <td>38</td>
      <td>12</td>
      <td>14</td>
      <td>12</td>
      <td>59</td>
      <td>53</td>
      <td>+6</td>
      <td>50</td>
      <td></td>
    </tr>
    <tr>
      <th>11</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Everton_F.C."
          title="Everton F.C."
          >Everton</a
        >
      </td>
      <td>38</td>
      <td>11</td>
      <td>14</td>
      <td>13</td>
      <td>59</td>
      <td>55</td>
      <td>+4</td>
      <td>47</td>
      <td></td>
    </tr>
    <tr>
      <th>12</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Swansea_City_A.F.C."
          title="Swansea City A.F.C."
          >Swansea City</a
        >
      </td>
      <td>38</td>
      <td>12</td>
      <td>11</td>
      <td>15</td>
      <td>42</td>
      <td>52</td>
      <td>−10</td>
      <td>47</td>
      <td></td>
    </tr>
    <tr>
      <th>13</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Watford_F.C."
          title="Watford F.C."
          >Watford</a
        >
      </td>
      <td>38</td>
      <td>12</td>
      <td>9</td>
      <td>17</td>
      <td>40</td>
      <td>50</td>
      <td>−10</td>
      <td>45</td>
      <td></td>
    </tr>
    <tr>
      <th>14</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/West_Bromwich_Albion_F.C."
          title="West Bromwich Albion F.C."
          >West Bromwich Albion</a
        >
      </td>
      <td>38</td>
      <td>10</td>
      <td>13</td>
      <td>15</td>
      <td>34</td>
      <td>48</td>
      <td>−14</td>
      <td>43</td>
      <td></td>
    </tr>
    <tr>
      <th>15</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Crystal_Palace_F.C."
          title="Crystal Palace F.C."
          >Crystal Palace</a
        >
      </td>
      <td>38</td>
      <td>11</td>
      <td>9</td>
      <td>18</td>
      <td>39</td>
      <td>51</td>
      <td>−12</td>
      <td>42</td>
      <td></td>
    </tr>
    <tr>
      <th>16</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/A.F.C._Bournemouth"
          title="A.F.C. Bournemouth"
          >AFC Bournemouth</a
        >
      </td>
      <td>38</td>
      <td>11</td>
      <td>9</td>
      <td>18</td>
      <td>45</td>
      <td>67</td>
      <td>−22</td>
      <td>42</td>
      <td></td>
    </tr>
    <tr>
      <th>17</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Sunderland_A.F.C."
          title="Sunderland A.F.C."
          >Sunderland</a
        >
      </td>
      <td>38</td>
      <td>9</td>
      <td>12</td>
      <td>17</td>
      <td>48</td>
      <td>62</td>
      <td>−14</td>
      <td>39</td>
      <td></td>
    </tr>
    <tr>
      <th>18</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Newcastle_United_F.C."
          title="Newcastle United F.C."
          >Newcastle United</a
        >
        <strong>(R)</strong>
      </td>
      <td>38</td>
      <td>9</td>
      <td>10</td>
      <td>19</td>
      <td>44</td>
      <td>65</td>
      <td>−21</td>
      <td>37</td>
      <td>
        Relegation to the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"
          title="2016–17 Football League Championship"
          >Football League Championship</a
        >
      </td>
    </tr>
    <tr>
      <th>19</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Norwich_City_F.C."
          title="Norwich City F.C."
          >Norwich City</a
        >
        <strong>(R)</strong>
      </td>
      <td>38</td>
      <td>9</td>
      <td>7</td>
      <td>22</td>
      <td>39</td>
      <td>67</td>
      <td>−28</td>
      <td>34</td>
      <td>
        Relegation to the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"
          title="2016–17 Football League Championship"
          >Football League Championship</a
        >
      </td>
    </tr>
    <tr>
      <th>20</th>
      <td>
        <a
          href="https://en.wikipedia.org/wiki/Aston_Villa_F.C."
          title="Aston Villa F.C."
          >Aston Villa</a
        >
        <strong>(R)</strong>
      </td>
      <td>38</td>
      <td>3</td>
      <td>8</td>
      <td>27</td>
      <td>27</td>
      <td>76</td>
      <td>−49</td>
      <td>17</td>
      <td>
        Relegation to the
        <a
          href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"
          title="2016–17 Football League Championship"
          >Football League Championship</a
        >
      </td>
    </tr>
  </tbody>
</table>

色 #

カラー修飾子の1つを追加することで、単一の<td>または<th>セル、または全体の<tr>行の色を変更できます。

is-primary
is-link
is-info
is-success
is-warning
is-danger
is-black
is-dark
is-light
is-white

例

リンク th セル	2	リンク td セル	4	5
リンク行	2	3	4	5
プライマリ th セル	2	プライマリ td セル	4	5
プライマリ行	2	3	4	5
情報 th セル	2	情報 td セル	4	5
情報行	2	3	4	5
成功 th セル	2	成功 td セル	4	5
成功行	2	3	4	5
警告 th セル	2	警告 td セル	4	5
警告行	2	3	4	5
危険 th セル	2	危険 td セル	4	5
危険行	2	3	4	5

HTML

<table class="table is-bordered">
  <tbody>
    
      <tr>
        <th class="is-link">Link th cell</th>
        <td>Two</td>
        <td class="is-link">Link td cell</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
      <tr class="is-link">
        <th>Link row</th>
        <td>Two</td>
        <td>Three</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
    
      <tr>
        <th class="is-primary">Primary th cell</th>
        <td>Two</td>
        <td class="is-primary">Primary td cell</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
      <tr class="is-primary">
        <th>Primary row</th>
        <td>Two</td>
        <td>Three</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
    
      <tr>
        <th class="is-info">Info th cell</th>
        <td>Two</td>
        <td class="is-info">Info td cell</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
      <tr class="is-info">
        <th>Info row</th>
        <td>Two</td>
        <td>Three</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
    
      <tr>
        <th class="is-success">Success th cell</th>
        <td>Two</td>
        <td class="is-success">Success td cell</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
      <tr class="is-success">
        <th>Success row</th>
        <td>Two</td>
        <td>Three</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
    
      <tr>
        <th class="is-warning">Warning th cell</th>
        <td>Two</td>
        <td class="is-warning">Warning td cell</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
      <tr class="is-warning">
        <th>Warning row</th>
        <td>Two</td>
        <td>Three</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
    
      <tr>
        <th class="is-danger">Danger th cell</th>
        <td>Two</td>
        <td class="is-danger">Danger td cell</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
      <tr class="is-danger">
        <th>Danger row</th>
        <td>Two</td>
        <td>Three</td>
        <td>Four</td>
        <td>Five</td>
      </tr>
    
  </tbody>
</table>

修飾子 #

すべてのセルに境界線を追加します。

table is-bordered

1	2
3	4

テーブルにストライプを追加します。

table is-striped

1	2
3	4
5	6
7	8
9	10
11	12

セルを狭くします。

table is-narrow

1	2
3	4
5	6
7	8
9	10
11	12

各行にホバー効果を追加できます。

table is-hoverable

1	2
3	4
5	6
7	8
9	10
11	12

全幅のテーブルにすることができます。

table is-fullwidth

1	2
3	4
5	6
7	8
9	10
11	12

5つの修飾子をすべて組み合わせることができます。

table is-bordered is-striped is-narrow is-hoverable is-fullwidth

1	2
3	4
5	6
7	8
9	10
11	12

テーブルコンテナ #

table-container要素でtableをラップすることで、スクロール可能なテーブルを作成できます。

<div class="table-container">
  <table class="table">
    <!-- Your table content -->
  </table>
</div>

1	2	3	4	5	6	7	8	9	10	11	12	13	14	15	16	17	18	19	20	21	22	23	24	25	26	27	28	29	30	31	32	33	34	35	36	37	38	39	40	41	42	43	44	45	46	47	48	49	50	51	52	53	54	55	56	57	58	59	60	61	62	63	64	65	66	67	68	69	70	71	72	73	74	75	76	77	78	79	80	81	82	83	84	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100
2	4	6	8	10	12	14	16	18	20	22	24	26	28	30	32	34	36	38	40	42	44	46	48	50	52	54	56	58	60	62	64	66	68	70	72	74	76	78	80	82	84	86	88	90	92	94	96	98	100	102	104	106	108	110	112	114	116	118	120	122	124	126	128	130	132	134	136	138	140	142	144	146	148	150	152	154	156	158	160	162	164	166	168	170	172	174	176	178	180	182	184	186	188	190	192	194	196	198	200
3	6	9	12	15	18	21	24	27	30	33	36	39	42	45	48	51	54	57	60	63	66	69	72	75	78	81	84	87	90	93	96	99	102	105	108	111	114	117	120	123	126	129	132	135	138	141	144	147	150	153	156	159	162	165	168	171	174	177	180	183	186	189	192	195	198	201	204	207	210	213	216	219	222	225	228	231	234	237	240	243	246	249	252	255	258	261	264	267	270	273	276	279	282	285	288	291	294	297	300
4	8	12	16	20	24	28	32	36	40	44	48	52	56	60	64	68	72	76	80	84	88	92	96	100	104	108	112	116	120	124	128	132	136	140	144	148	152	156	160	164	168	172	176	180	184	188	192	196	200	204	208	212	216	220	224	228	232	236	240	244	248	252	256	260	264	268	272	276	280	284	288	292	296	300	304	308	312	316	320	324	328	332	336	340	344	348	352	356	360	364	368	372	376	380	384	388	392	396	400
5	10	15	20	25	30	35	40	45	50	55	60	65	70	75	80	85	90	95	100	105	110	115	120	125	130	135	140	145	150	155	160	165	170	175	180	185	190	195	200	205	210	215	220	225	230	235	240	245	250	255	260	265	270	275	280	285	290	295	300	305	310	315	320	325	330	335	340	345	350	355	360	365	370	375	380	385	390	395	400	405	410	415	420	425	430	435	440	445	450	455	460	465	470	475	480	485	490	495	500

Sass 変数	CSS 変数	値
`$table-color`	`var(--bulma-table-color)`	`var(--bulma-text-strong)`
`$table-background-color`	`var(--bulma-table-background-color)`	`var(--bulma-scheme-main)`
`$table-cell-border-color`	`var(--bulma-table-cell-border-color)`	`var(--bulma-border)`
`$table-cell-border-style`	`var(--bulma-table-cell-border-style)`	`solid`
`$table-cell-border-width`	`var(--bulma-table-cell-border-width)`	`0 0 1px`
`$table-cell-padding`	`var(--bulma-table-cell-padding)`	`0.5em 0.75em`
`$table-cell-heading-color`	`var(--bulma-table-cell-heading-color)`	`var(--bulma-text-strong)`
`$table-cell-text-align`	`var(--bulma-table-cell-text-align)`	`left`
`$table-head-cell-border-width`	`var(--bulma-table-head-cell-border-width)`	`0 0 2px`
`$table-head-cell-color`	`var(--bulma-table-head-cell-color)`	`var(--bulma-text-strong)`
`$table-foot-cell-border-width`	`var(--bulma-table-foot-cell-border-width)`	`2px 0 0`
`$table-foot-cell-color`	`var(--bulma-table-foot-cell-color)`	`var(--bulma-text-strong)`
`$table-head-background-color`	`var(--bulma-table-head-background-color)`	`transparent`
`$table-body-background-color`	`var(--bulma-table-body-background-color)`	`transparent`
`$table-foot-background-color`	`var(--bulma-table-foot-background-color)`	`transparent`
`$table-row-hover-background-color`	`var(--bulma-table-row-hover-background-color)`	`var(--bulma-scheme-main-bis)`
`$table-row-active-background-color`	`var(--bulma-table-row-active-background-color)`	`var(--bulma-primary)`
`$table-row-active-color`	`var(--bulma-table-row-active-color)`	`var(--bulma-primary-invert)`
`$table-striped-row-even-background-color`	`var(--bulma-table-striped-row-even-background-color)`	`var(--bulma-scheme-main-bis)`
`$table-striped-row-even-hover-background-color`	`var(--bulma-table-striped-row-even-hover-background-color)`	`cv.getVar( "scheme-main-ter" )`

Sass と CSS 変数 #

Sass 変数	CSS 変数	値
`$table-color`	`var(--bulma-table-color)`	`var(--bulma-text-strong)`
`$table-background-color`	`var(--bulma-table-background-color)`	`var(--bulma-scheme-main)`
`$table-cell-border-color`	`var(--bulma-table-cell-border-color)`	`var(--bulma-border)`
`$table-cell-border-style`	`var(--bulma-table-cell-border-style)`	`solid`
`$table-cell-border-width`	`var(--bulma-table-cell-border-width)`	`0 0 1px`
`$table-cell-padding`	`var(--bulma-table-cell-padding)`	`0.5em 0.75em`
`$table-cell-heading-color`	`var(--bulma-table-cell-heading-color)`	`var(--bulma-text-strong)`
`$table-cell-text-align`	`var(--bulma-table-cell-text-align)`	`left`
`$table-head-cell-border-width`	`var(--bulma-table-head-cell-border-width)`	`0 0 2px`
`$table-head-cell-color`	`var(--bulma-table-head-cell-color)`	`var(--bulma-text-strong)`
`$table-foot-cell-border-width`	`var(--bulma-table-foot-cell-border-width)`	`2px 0 0`
`$table-foot-cell-color`	`var(--bulma-table-foot-cell-color)`	`var(--bulma-text-strong)`
`$table-head-background-color`	`var(--bulma-table-head-background-color)`	`transparent`
`$table-body-background-color`	`var(--bulma-table-body-background-color)`	`transparent`
`$table-foot-background-color`	`var(--bulma-table-foot-background-color)`	`transparent`
`$table-row-hover-background-color`	`var(--bulma-table-row-hover-background-color)`	`var(--bulma-scheme-main-bis)`
`$table-row-active-background-color`	`var(--bulma-table-row-active-background-color)`	`var(--bulma-primary)`
`$table-row-active-color`	`var(--bulma-table-row-active-color)`	`var(--bulma-primary-invert)`
`$table-striped-row-even-background-color`	`var(--bulma-table-striped-row-even-background-color)`	`var(--bulma-scheme-main-bis)`
`$table-striped-row-even-hover-background-color`	`var(--bulma-table-striped-row-even-hover-background-color)`	`cv.getVar( "scheme-main-ter" )`

ここから始めましょう

機能

Sass ツール

カスタマイズ

CSS ライブラリ

CSS ヘルパー

スポンサー

表

特殊なセルを持つ、避けられない HTML テーブル

色 #

修飾子 #

テーブルコンテナ #

Sass と CSS 変数 #

Bulma のサポート方法

1	2	3	4	5	6	7	8	9	10	11	12	13	14	15	16	17	18	19	20	21	22	23	24	25	26	27	28	29	30	31	32	33	34	35	36	37	38	39	40	41	42	43	44	45	46	47	48	49	50	51	52	53	54	55	56	57	58	59	60	61	62	63	64	65	66	67	68	69	70	71	72	73	74	75	76	77	78	79	80	81	82	83	84	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100
2	4	6	8	10	12	14	16	18	20	22	24	26	28	30	32	34	36	38	40	42	44	46	48	50	52	54	56	58	60	62	64	66	68	70	72	74	76	78	80	82	84	86	88	90	92	94	96	98	100	102	104	106	108	110	112	114	116	118	120	122	124	126	128	130	132	134	136	138	140	142	144	146	148	150	152	154	156	158	160	162	164	166	168	170	172	174	176	178	180	182	184	186	188	190	192	194	196	198	200
3	6	9	12	15	18	21	24	27	30	33	36	39	42	45	48	51	54	57	60	63	66	69	72	75	78	81	84	87	90	93	96	99	102	105	108	111	114	117	120	123	126	129	132	135	138	141	144	147	150	153	156	159	162	165	168	171	174	177	180	183	186	189	192	195	198	201	204	207	210	213	216	219	222	225	228	231	234	237	240	243	246	249	252	255	258	261	264	267	270	273	276	279	282	285	288	291	294	297	300
4	8	12	16	20	24	28	32	36	40	44	48	52	56	60	64	68	72	76	80	84	88	92	96	100	104	108	112	116	120	124	128	132	136	140	144	148	152	156	160	164	168	172	176	180	184	188	192	196	200	204	208	212	216	220	224	228	232	236	240	244	248	252	256	260	264	268	272	276	280	284	288	292	296	300	304	308	312	316	320	324	328	332	336	340	344	348	352	356	360	364	368	372	376	380	384	388	392	396	400
5	10	15	20	25	30	35	40	45	50	55	60	65	70	75	80	85	90	95	100	105	110	115	120	125	130	135	140	145	150	155	160	165	170	175	180	185	190	195	200	205	210	215	220	225	230	235	240	245	250	255	260	265	270	275	280	285	290	295	300	305	310	315	320	325	330	335	340	345	350	355	360	365	370	375	380	385	390	395	400	405	410	415	420	425	430	435	440	445	450	455	460	465	470	475	480	485	490	495	500

1	2	3	4	5	6	7	8	9	10	11	12	13	14	15	16	17	18	19	20	21	22	23	24	25	26	27	28	29	30	31	32	33	34	35	36	37	38	39	40	41	42	43	44	45	46	47	48	49	50	51	52	53	54	55	56	57	58	59	60	61	62	63	64	65	66	67	68	69	70	71	72	73	74	75	76	77	78	79	80	81	82	83	84	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100
2	4	6	8	10	12	14	16	18	20	22	24	26	28	30	32	34	36	38	40	42	44	46	48	50	52	54	56	58	60	62	64	66	68	70	72	74	76	78	80	82	84	86	88	90	92	94	96	98	100	102	104	106	108	110	112	114	116	118	120	122	124	126	128	130	132	134	136	138	140	142	144	146	148	150	152	154	156	158	160	162	164	166	168	170	172	174	176	178	180	182	184	186	188	190	192	194	196	198	200
3	6	9	12	15	18	21	24	27	30	33	36	39	42	45	48	51	54	57	60	63	66	69	72	75	78	81	84	87	90	93	96	99	102	105	108	111	114	117	120	123	126	129	132	135	138	141	144	147	150	153	156	159	162	165	168	171	174	177	180	183	186	189	192	195	198	201	204	207	210	213	216	219	222	225	228	231	234	237	240	243	246	249	252	255	258	261	264	267	270	273	276	279	282	285	288	291	294	297	300
4	8	12	16	20	24	28	32	36	40	44	48	52	56	60	64	68	72	76	80	84	88	92	96	100	104	108	112	116	120	124	128	132	136	140	144	148	152	156	160	164	168	172	176	180	184	188	192	196	200	204	208	212	216	220	224	228	232	236	240	244	248	252	256	260	264	268	272	276	280	284	288	292	296	300	304	308	312	316	320	324	328	332	336	340	344	348	352	356	360	364	368	372	376	380	384	388	392	396	400
5	10	15	20	25	30	35	40	45	50	55	60	65	70	75	80	85	90	95	100	105	110	115	120	125	130	135	140	145	150	155	160	165	170	175	180	185	190	195	200	205	210	215	220	225	230	235	240	245	250	255	260	265	270	275	280	285	290	295	300	305	310	315	320	325	330	335	340	345	350	355	360	365	370	375	380	385	390	395	400	405	410	415	420	425	430	435	440	445	450	455	460	465	470	475	480	485	490	495	500

1	2	3	4	5	6	7	8	9	10	11	12	13	14	15	16	17	18	19	20	21	22	23	24	25	26	27	28	29	30	31	32	33	34	35	36	37	38	39	40	41	42	43	44	45	46	47	48	49	50	51	52	53	54	55	56	57	58	59	60	61	62	63	64	65	66	67	68	69	70	71	72	73	74	75	76	77	78	79	80	81	82	83	84	85	86	87	88	89	90	91	92	93	94	95	96	97	98	99	100
2	4	6	8	10	12	14	16	18	20	22	24	26	28	30	32	34	36	38	40	42	44	46	48	50	52	54	56	58	60	62	64	66	68	70	72	74	76	78	80	82	84	86	88	90	92	94	96	98	100	102	104	106	108	110	112	114	116	118	120	122	124	126	128	130	132	134	136	138	140	142	144	146	148	150	152	154	156	158	160	162	164	166	168	170	172	174	176	178	180	182	184	186	188	190	192	194	196	198	200
3	6	9	12	15	18	21	24	27	30	33	36	39	42	45	48	51	54	57	60	63	66	69	72	75	78	81	84	87	90	93	96	99	102	105	108	111	114	117	120	123	126	129	132	135	138	141	144	147	150	153	156	159	162	165	168	171	174	177	180	183	186	189	192	195	198	201	204	207	210	213	216	219	222	225	228	231	234	237	240	243	246	249	252	255	258	261	264	267	270	273	276	279	282	285	288	291	294	297	300
4	8	12	16	20	24	28	32	36	40	44	48	52	56	60	64	68	72	76	80	84	88	92	96	100	104	108	112	116	120	124	128	132	136	140	144	148	152	156	160	164	168	172	176	180	184	188	192	196	200	204	208	212	216	220	224	228	232	236	240	244	248	252	256	260	264	268	272	276	280	284	288	292	296	300	304	308	312	316	320	324	328	332	336	340	344	348	352	356	360	364	368	372	376	380	384	388	392	396	400
5	10	15	20	25	30	35	40	45	50	55	60	65	70	75	80	85	90	95	100	105	110	115	120	125	130	135	140	145	150	155	160	165	170	175	180	185	190	195	200	205	210	215	220	225	230	235	240	245	250	255	260	265	270	275	280	285	290	295	300	305	310	315	320	325	330	335	340	345	350	355	360	365	370	375	380	385	390	395	400	405	410	415	420	425	430	435	440	445	450	455	460	465	470	475	480	485	490	495	500