表に枠線をつける方法

tableタグで作った表に枠線をつける方法について

<table border="〇">

の〇の部分に数字を指定することで、枠線をつけることができる。
（数字を変えることで枠線の太さが変わる）

数字を指定していない場合

<table>
<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円

数字を指定した場合

〇の部分の数字を2にした例

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

〇の部分の数字を5にした例

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

まとめ

・表には枠線をつけることができる
・表の枠線の太さは変えることができる。

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

HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方【電子書籍】[ 吉田真麻 ]