17. 外枠線・内枠線

CHECK POINTS
BorderCellspacingCellpaddingFrameRulesborder
■外枠線・内枠線

★ 実行例 [17-1〜17-8]:「色の有無、枠線の違いによるテーブルの見栄え」

果実の成分表/100g
果 実廃棄率
(%)
エネルギー
(kcal)
水 分
(g)
炭水化物
(g)
ビタミンC
(mg)
合 計-291617.075.02027
リンゴ155484.914.64
スイカ403789.69.510
メロン504287.810.318
ミカン204587.211.935
オレンジ403988.79.840
グアバ303888.99.9220
アセロラ253689.99.01700
17-1.html
Border=1, Cellspacing=1, Cellpadding=3,
Frame=hsides, Rules=rows, 色なし
果実の成分表/100g
果 実廃棄率
(%)
エネルギー
(kcal)
水 分
(g)
炭水化物
(g)
ビタミンC
(mg)
合 計-291617.075.02027
リンゴ155484.914.64
スイカ403789.69.510
メロン504287.810.318
ミカン204587.211.935
オレンジ403988.79.840
グアバ303888.99.9220
アセロラ253689.99.01700
17-2.html
Border=1, Cellspacing=0, Cellpadding=3,
Frame=hsides, Rules=rows
果実の成分表/100g
果 実廃棄率
(%)
エネルギー
(kcal)
水 分
(g)
炭水化物
(g)
ビタミンC
(mg)
合 計-291617.075.02027
リンゴ155484.914.64
スイカ403789.69.510
メロン504287.810.318
ミカン204587.211.935
オレンジ403988.79.840
グアバ303888.99.9220
アセロラ253689.99.01700
17-3.html
Border=1, Cellspacing=0, Cellpadding=3,
Frame=void, Rules=groups
果実の成分表/100g
果 実廃棄率
(%)
エネルギー
(kcal)
水 分
(g)
炭水化物
(g)
ビタミンC
(mg)
合 計-291617.075.02027
リンゴ155484.914.64
スイカ403789.69.510
メロン504287.810.318
ミカン204587.211.935
オレンジ403988.79.840
グアバ303888.99.9220
アセロラ253689.99.01700
17-4.html
Border=1, Cellspacing=0, Cellpadding=3, Frame=void, Rules=groups,
TABLE {font-size: 0.8em; border: 1px solid Black}
果実の成分表/100g
果 実廃棄率
(%)
エネルギー
(kcal)
水 分
(g)
炭水化物
(g)
ビタミンC
(mg)
合 計-291617.075.02027
リンゴ155484.914.64
スイカ403789.69.510
メロン504287.810.318
ミカン204587.211.935
オレンジ403988.79.840
グアバ303888.99.9220
アセロラ253689.99.01700
17-5.html
Border=1, Cellspacing=1, Cellpadding=3, Frame=void, Rules=cols,
TABLE {font-size: 0.8em; border: 3px solid Pink}
果実の成分表/100g
果 実廃棄率
(%)
エネルギー
(kcal)
水 分
(g)
炭水化物
(g)
ビタミンC
(mg)
合 計-291617.075.02027
リンゴ155484.914.64
スイカ403789.69.510
メロン504287.810.318
ミカン204587.211.935
オレンジ403988.79.840
グアバ303888.99.9220
アセロラ253689.99.01700
17-6.html
Border=1, Cellspacing=0, Cellpadding=3, Frame=void, Rules=none,
TABLE,TH,TD {border: 1px solid Orange}
TABLE {font-size: 0.8em}
果実の成分表/100g
果 実廃棄率
(%)
エネルギー
(kcal)
水 分
(g)
炭水化物
(g)
ビタミンC
(mg)
合 計-291617.075.02027
リンゴ155484.914.64
スイカ403789.69.510
メロン504287.810.318
ミカン204587.211.935
オレンジ403988.79.840
グアバ303888.99.9220
アセロラ253689.99.01700
17-7.html
Border=1, Cellspacing=2, Cellpadding=3, Frame=box, Rules=none,
TABLE,TH,TD {border: 1px solid Black}
TABLE {font-size: 0.8em}
果実の成分表/100g
果 実廃棄率
(%)
エネルギー
(kcal)
水 分
(g)
炭水化物
(g)
ビタミンC
(mg)
合 計-291617.075.02027
リンゴ155484.914.64
スイカ403789.69.510
メロン504287.810.318
ミカン204587.211.935
オレンジ403988.79.840
グアバ303888.99.9220
アセロラ253689.99.01700
17-8.html
Border=1, Cellspacing=2, Cellpadding=3, Frame=box, Rules=none,
TABLE {font-size: 0.8em; border: 1px solid Black}
TH,TD {border: 1px outset White}