枠線の色を2色で指定する

[新着] Webテンプレートを仮オープンしました


<table border="" bordercolorlight="" bordercolordark="">

ブラウザ
Internet Explorer
タイプ
ブロック要素 (独自拡張)

tableタグbordercolorlight=""bordercolordark="" を追加すると、枠線の色を2色で指定できます。


<table border="5" bordercolorlight="#006fdd" bordercolordark="#b9dcff">


bordercolorlight="" 枠線の明るい部分の色を指定します
bordercolordark="" 枠線の暗い部分の色を指定します

IEの場合、bordercolor属性 の指定では平面的な枠線になってしまいますが、上記の属性で明るい部分と暗い部分を2色で表現することにより、表の枠線を立体的に見せることが可能になります。

色の指定は、シャープ( # )で始まる6桁のカラーコードか、redやgreen、whiteといったカラーネームで行います。詳細についてはカラーチャートのページをご覧ください。

border="" については、「枠の線を指定する」をご覧ください。

メモ

スタイルシートでも、立体的な枠線を表現することが可能です。(上下左右の枠線の色を個別に指定します)


使用例

<table border="5" bordercolorlight="#b9dcff" bordercolordark="#006fdd">
<tr>
<td>Webデザイン</td>
<td>Web作成</td>
<td>Webプロモーション</td>
</tr>
</table>

これをブラウザで見ると次のように表示されます

Webデザイン Web作成 Webプロモーション


[特集] レンタルサーバー比較 & サーバー選びのチェックポイント

サイト内検索について - ベーシック版