表の枠線アラカルト

ふつうの表って,こんな感じ。
<TABLE border="1">

                   
                   

ちょっと味気ない。では,色を付けてみよう。次のように書き換えます。
<TABLE borderColor="blue" border="1">

                   
                   

2色を指定できます。太さも変えてみます。
<TABLE borderColorDark="green" borderColorLight="aqua" border="1">

                   
                   

<TABLE borderColorDark="green" borderColorLight="red" border="4">

                   
                   

1本の直線の表にすることもできます。
<TABLE id=AutoNumber1 style="BORDER-COLLAPSE: collapse" borderColor=deeppink border=1>

                   
                   

スタイルシートを使わなくても点線や波線になります。

<TABLE border="1" bgcolor="white" style="border:2px dotted red;">
       
       

また,表の中に表を入れると違った感じの表ができます。いろいろ組み合わせてみてください。

<TABLE border="1" bgcolor="lavender" style="border:2px dashed purple;">
中のセルは
実線

<TD bgcolor="white" style="border:2px solid violet;" align="center" width="50"> </TD>
点線
<TD bgcolor="white" style="border:2px dotted violet;" align="center" width="50"> </TD>
波線
<TD bgcolor="white" style="border:2px dashed violet;" align="center" width="50"> </TD>

       
       
       

それぞれの色も変えられます。パステル調だとこんな感じ。
<TABLE><TR>
<TD style="border-top:2px solid palegreen;
border-bottom:2px solid paleturquoise;
border-right:2px solid yellow;
border-left:2px solid lightpink;" width="250" bgcolor="white"height="170">
</TD>
</TR></TABLE>

色は,色見本を参考にしてください。カラーコードでもカラーネームでも大丈夫だと思いますが。
ホームページビルダーでは「ページ編集」では変化なく見えますが,「プレビュー」にすると,ちゃんとできていますから,ご安心を。

SEO 英会話 フラワーギフト 無料レンタルサーバー ブログ SEO