日々のこと

読者です 読者をやめる 読者になる 読者になる

日々のこと

HTMLやCSSのことも書いています。

表に色をつける方法

スポンサーリンク

表に色をつけるには

tableタグ内に「bgcolor」の記述を行うことで、表に色をつけることができる。

<table bgcolor="">

「""」の中には色の指定を行う記述をする。

黄色に指定した場合

<table bgcolor="yellow">
<tr>
 <th>商品名</th>
 <th>個数</th>
 <th>価格</th>
 </tr>
 <tr>
 <td>パン</td>
 <td>10</td>
 <td>100円</td>
 </tr>
 <tr>
 <td>おにぎり</td>
 <td>10</td>
 <td>100円</td>
 </tr>
 <tr>
 <td>水</td>
 <td>10</td>
 <td>100円</td>
 </tr>
 </table>

表示例

商品名 個数 価格
パン 10 100円
おにぎり 10 100円
10 100円

列ごとに色を変えるには

trタグ内に記述を行うことで、列ごとに色の指定を行うこともできる。

<tr bgcolor="">

列の色を3色にした場合

<table>
<tr>
 <th>商品名</th>
 <th>個数</th>
 <th>価格</th>
 </tr>
 <tr bgcolor="yellow">
 <td>パン</td>
 <td>10</td>
 <td>100円</td>
 </tr>
 <tr bgcolor="gold">
 <td>おにぎり</td>
 <td>10</td>
 <td>100円</td>
 </tr>
 <tr bgcolor="orange">
 <td>水</td>
 <td>10</td>
 <td>100円</td>
 </tr>
 </table>

表示例

商品名 個数 価格
パン 10 100円
おにぎり 10 100円
10 100円

まとめ

・bgcolorを使うことで表や列に色をつけることができる。
・表全体に色をつける場合はtableタグ内に書く。
・列ごとに色をつける場合はtrタグ内に書く。

<スポンサーリンク>


関連記事
www.hibinokoto01.com
www.hibinokoto01.com
www.hibinokoto01.com