◆・・・ 文字に線を引いてみませんか。・・・◆
●上に線を引いてみます。
文字の上に線を引くと
こんな感じです。
<font style="border-top-style:dotted;border-color:9e99d9;line-height:40px;">
●下に線を引いてみます。
文字の下に線を引くと
こんな感じでになります。
<font style="border-bottom-style:dotted;border-color:red;line-height:55px;">
●くぼんだ感じの線を引いてみます。
くぼんだ感じの線を引くと
こんな感じになります。
<font style="border-bottom-style:groove;border-color:blue;line-height:40px;">
●浮き上がった感じの線を引いてみます。
浮き上がった感じの線を引くと
こんな感じになります。
<font style="border-bottom-style:ridge;border-color:99ffab;line-height:35px;">
●破線を引いてみます。
破線を引いた場合は、
こんな感じになります。
<font style="border-bottom-style:dashed;border-color:deeppink;line-height:35px;">
●二重線を引いてみます。
二重線を引くと
こんな感じになります。
<font style="border-bottom-style:double;border-color:a400db;line-height:50px;">
●OUT線を引いてみます。
OUT線を引くと
こんな感じになります。
<font style="border-bottom-style:outset;border-color:lime;line-height:40px;">
●IN線を引いてみます。
IN線を引くと
こんな感じになります。
<font style="border-bottom-style:inset;border-color:lime;line-height:40px;">
*~*~*~*~*~*~*~*~*~*~*~*~*~*~*
☆・・・違いがわかりますか?・・・☆
color:線の色;
line-height:行の高さpx;
線の色や(色は色番号・色の名前のどちらでもOKです。)
行の高さを変更する場合は、緑の文字の所を直してください。
OUT線とIN線の違いは良くわからないようなので、比較
しやすいように、下に書いてみました。
◆ 背景を黒にして、同じ色を使って比較してみました。◆
● OUT線
OUT線を引くと
こんな感じになります。
● IN線
IN線を引くと
こんな感じになります。