text-decoration-line CSS3
text-decoration-line は、上線、下線、取り消し線を指定します。複数指定もできます。
名前 | : | text-decoration-line |
値 | : | none | [ underline || overline || line-through || blink ] |
初期値 | : | none |
適用対象 | : | 全ての要素 |
継承 | : | しない |
パーセンテージ | : | n/a |
メディア | : | visual(視覚的) |
計算値 | : | As specified(指定通り) |
アニメーション | : | できない |
Value(値)
- none
- 初期値 線無し
- underline
- 下線
- overline
- 上線
- line-through
- 取り消し線
- blink
- 点滅(非推奨 / サポートしている最新 UA なし)
HTML source
<!DOCTYPE html> <html> <head> <title></title> <style> p.test1 { text-decoration-line: none; } p.test2 { text-decoration-line: underline; } p.test3 { text-decoration-line: overline; } p.test4 { text-decoration-line: line-through; } p.test5 { text-decoration-line: blink; } </style> </head> <body> <p class="test1">今日は 蒸し暑いですね。</p> <p class="test2">今日は 蒸し暑いですね。</p> <p class="test3">今日は 蒸し暑いですね。</p> <p class="test4">今日は 蒸し暑いですね。</p> <p class="test5">今日は 蒸し暑いですね。</p> </body> </html>
display
今日は 蒸し暑いですね。
今日は 蒸し暑いですね。
今日は 蒸し暑いですね。
今日は 蒸し暑いですね。
今日は 蒸し暑いですね。
- Google Chrome 64.0.3282.186、Firefox58.0.2にて表示確認。blink 以外。(2018/3/14)
- CSSソースにベンダープレフィックス「-moz-」を付けてます。