文字に線を付ける（ＣＳＳ）

2005年05月 - 23日 cm 3 tb 0 FC2ブックマークに追加
書式

text-decoration:　値（複数可）

文字に下線、上線をつける事が出来ます。複数指定でそれぞれ適用されます。
ソースを見た上で、サンプルをご覧下さい。

スタイルシート部分
.sample1{ text-decoration:underline}
/*▲上線*/
.sample2{ text-decoration:overline}
/*▲下線*/
.sample3{ text-decoration:underline overline}
/*▲下線、上線*/

ＨＴＭＬ部分
<span class="sample1">下に線を引きました</span>
<span class="sample2">上に線を引きました</span>
<span class="sample3">下と上に線を引きました</span>

サンプル
下に線を引きました

上に線を引きました

下と上に線を引きました

前後の記事

最近の記事

トラックバック

この記事へのトラックバックURL：
http://fc2blogshop.blog13.fc2.com/tb.php/224-df2935c1


コメント

BY hiro AT 2005/07/31 edit this comment
文字に線を引くについて教えてください。
よろしくお願いします。

文字に色つき点線を引きたいのですが
どうすれば出来るのでしょうか。
お願いします。
BY bonk AT 2005/07/31 edit this comment
スタイルシートでは色付き点線を実装できないと思います。
ＨＴＭＬタグの<abbr>タグで無理やり表示させる（ＩＥでは点線は表示されませんが・・・）事は出来ますが、そもそも色付き点線をお勧めできません。
なぜかと言うと、点下線はNetscapeやFirefoxなどでは「略語」を意味し、マウスオンする事により略語の説明を表示させる事を意味し、多くのユーザーもそう認識しています。ですので、もしかすると略語と勘違いし訪問者を困惑させる事があるからです。
リンクでない文字を青文字にすると訪問者を困惑させるのと同様、点下線もその危険性があります。
この「線を引く」というのも、通常のテキストに使用するのではなく、リンクテキスト用に使う事をお勧めします。
インターネット上での下線は「強調」では無く、リンクや略語を表すからです。



BY 匿名 AT 2007/07/25 edit this comment
文字の中に線を入れたいんですけど
管理者にだけ表示を許可する