NO.65 ボーダー①

枠に関する設定です。

border-top-width,border-right-width,border-bottom-width,border-left-width
上下左右の枠線の太さを個別に指定できます。
Value: thin(細枠) | medium(標準) | thick(太枠) | <length>

<div style="border-top-width:5px;border-right-width:thin;border-bottom-width:5px;border-left-width:thick;">This source is test.</div>

border-width
上下左右の枠線の太さを一括指定できます。
Value: [thin | medium | thick | <length>]{1,4}

<style type="text/css">
<!--
.t1{border-width:3px;}     /*上下左右に3pxの枠*/
.t2{border-width:4px 5px;}     /*上下4px,左右5pxの枠*/
.t3{border-width:6px 7px 8px;}     /*上6px,左右7px,下8pxの枠*/
-->
</style>
<div class=t1>This source is test.</div>
<div class=t2>This source is test.</div>
<div class=t3>This source is test.</div>

上記の内容を応用
◆HEAD内の記述 <style type="text/css">  </style>
◆BODY内の記述 test:<br> <table border class=zzA> <tr><td>border-top-width:15px;border-bottom-width:16px;border-right-width:17px;border-left-width:18px;</td></tr></table><br> test:<br> <table border class=zzB><tr><td>border-width:20px 30px;</td></tr></table><br>
◆実行例

test:

border-top-width:15px;border-bottom-width:16px;border-right-width:17px;border-left-width:18px;

test:

border-width:20px 30px;

前に戻る　次に進む

SEO		[PR] 爆速!無料ブログ無料ホームページ開設無料ライブ放送