CSS - text-decoration

トップ > CSSリファレンス > text-decoration

概要

属性名 text-decoration
<line> || <style> || <color> || blink
値の詳細
<line> = none || [ underline || overline || line-through ]
<style> = solid | double | dotted | dashed | wavy
初期値 none
適用可能要素すべての要素
継承継承しない
メディアVisual / Text
サポートC1 / e3 / N4 / Fx1 / Ch1 / Op3.5 / Sa1

説明

下線など、テキストの修飾を指定します。

説明
none下線などを表示しません。(C1/e3/N4/Fx1/Ch1/Op3.5/Sa1)
underline下線を表示します。(C1/e3/N4/Fx1/Ch1/Op3.5/Sa1)
overline上線を表示します。(C1/e3/N4/Fx1/Ch1/Op3.5/Sa1)
line-through打ち消し線を表示します。(C1/e3/N4/Fx1/Ch1/Op3.5/Sa1)
solid実線。(C3)
double二重線。(C3)
dotted点線。(C3)
dashed破線。(C3)
wavy波線。(C3)
<color>線の色を指定します。(C3)
blinkテキストをブリンクさせます。(C2/Fx/Op)

a要素に none を適用することで、下線の無いリンクを表示することができます。

a { text-decoration: none; }

使用例

HTML
<div style="text-decoration:none">線無し</div>
<div style="text-decoration:underline">下線</div>
<div style="text-decoration:overline">上線</div>
<div style="text-decoration:line-through">打ち消し線</div>
<div style="text-decoration:underline solid">下線・実線</div>
<div style="text-decoration:underline double">下線・二重線</div>
<div style="text-decoration:underline dotted">下線・点線</div>
<div style="text-decoration:underline dashed">下線・破線</div>
<div style="text-decoration:underline wavy">下線・波線</div>
<div style="text-decoration:underline red">下線・赤</div>
<div style="text-decoration:blink">ブリンク</div>
表示
線無し
下線
上線
打ち消し線
下線・実線
下線・二重線
下線・点線
下線・破線
下線・波線
下線・赤
ブリンク

Copyright (C) 1997-2012 杜甫々
初版:1997年7月27日、最終更新:2012年6月24日
http://www.tohoho-web.com/css/prop/text-decoration.htm