>>1pxで赤い点線、幅は500px
<<実例>>
<<ソース>>
<hr style="border:none;border-top:dashed 1px #ff0000;height:1px;color:#FFFFFF;width:500px;">
<<タグの再定義>>
このページ全部の水平線を赤点線にしたいゼという場合は
これをスタイルシートの中にぶちこみます。
hr{
border:none;
border-top:dashed 1px #FF0000;
height:1px;
color:#FFFFFF;
width:500px;
}
<<プチ解説>>
dashedが点線、1pxが幅、#FF0000が色の指定。
点線以外にsolidで直線、doubleで二重線などにできます。
もっと太い点線にしたい場合、ちょっと注意が必要です。
ブラウザによって表示が違うのです。IEなんかだと2px以上の太さになりません。
そこでheight(高さ)の設定です。
上下のborderの幅の合計以上の高さに設定すると回避できます。
ということで太さを変えたい場合はborder-topの中の1pxの部分と
heightの1px、両方いじってください。
最後、color:#FFFFFF;とかいてあります。
何?何が白なの?っつう感じですが、水平線本来の色です。
これを設定しないと変な灰色の線が現れます。
赤の点線は水平線と見せかけて水平線を囲っているborderです。
水平線自体を赤の点線にすることも可能ですが、
FIREFOXちゃんでは太さ1pxになってくれないのですorz