色々なテーブル枠１

色々なテーブル枠１

ｩ スタイルシート ｩ

【シンプルな形】

ここに文章や画像を入れてね

<table width="300" height="50" style="border:1px solid #好きな色;"><tr><td>文章や画像</td></tr></table>

『border:1px』は、枠の太さを表し、
数字を大きくすると枠が太くなります。

『#66CCFF』は枠自体の色で、カラーや色名で好きな色にできます。

『solid』は、線状の枠を指定する値です。

ちなみに『background-color:#FFFF66;』をプラスすると。。。。

背景がつきました

<table width="300" height="50" style="border:1px solid #好きな色;background-color:#FFFF66(好きな色);"><tr><td>文章や画像</td></tr></table>

『dashed』をつかって枠を点線に

【border:1px の場合】

ここに文章や画像を入れてね

<table width="300" height="50" style="border:1px dashed #好きな色;"><tr><td>文章や画像</td></tr></table>

【border:3px background-color:#CCFFCC; の場合】

ここに文章や画像を入れてね

<table width="300" height="50" style="border:3px dashed #好きな色;background-color:#CCFFCC(好きな色);"><tr><td>文章や画像</td></tr></table>

『double』をつかって枠を2重に
(『border:2px』以下だと2重にならないので注意！)

【border:3px のとき】

ここに文章や画像を入れてね

<table width="300" height="50" style="border:3px double #好きな色;"><tr><td>文章や画像</td></tr></table>

【border:4px background-color:#FFF3FF; のとき】
(外側の枠が太くなりました）

ここに文章や画像を入れてね

<table width="300" height="50" style="border:4px double #好きな色;background-color:#FFF3FF(好きな色);"><tr><td>文章や画像</td></tr></table>

『dotted』をつかって枠を可愛く

【border:3px のとき】

ここに文章や画像を入れてね

<table width="300" height="50" style="border:3px dotted #好きな色;"><tr><td>文章や画像</td></tr></table>

【border:4px background-color:#FFF3FF; のとき】

ここに文章や画像を入れてね

<table width="300" height="50" style="border:4px dotted #好きな色;background-color:#FFF3FF(好きな色);"><tr><td>文章や画像</td></tr></table>

template- yamato

ジャンル別一覧

人気のクチコミテーマ

スマートフォン版を閲覧 | PC版を閲覧