項 目 | 説 明 |
---|---|
記述形式 | セレクタ {text-decoration-line: 値 } |
値 の形式 | none,underline,overline,line-through,blink |
初 期 値 | none |
対応ブラウザー | C1+ / e3+ / N4+ / Fx1+ / Op3.5+ / Ch1+ / Sa1+ |
適用可能な要素 | すべての要素 |
継 承 | しない |
CSS2.1 までの text-decorationプロパティ の機能は,CSS3では text-decoration-lineプロパティ に移行になりました。
text-decoration-lineプロパティ は,テキストの下線・上線・打消し線・点滅を指定します。 これらのうちの複数の同時指定もできます。
指定できる値の形式は,以下のとおりです。
値 | 説 明 |
---|---|
none | 線をつけたり,点滅したりしません。 (初期値) |
underline | 下線を引きます。 |
overline | 上線を引きます。 |
line-through | 打消し線を引きます。 |
blink | 点滅させます。 |
現時点では,対応しているブラウザーは少ないので,互換性のある text-decoration プロパティ を使用する方がよい と思われます。
HTMLソース | |
---|---|
CSS <head> ~ </head> |
<style type="text/css"> <!-- p.decr1 { text-decoration-line: none; } p.decr2 { text-decoration-line: underline; } p.decr3 { text-decoration-line: overline; } p.decr4 { text-decoration-line: line-through; } p.decr5 { text-decoration-line: blink; } p.decr6 { text-decoration-line: underline overline line-through; } --> </style> |
HTML <body> ~ </body> |
<p class="decr1"><b>none:</b> 線は付かず,点滅もしません。 初期値。</p> <p class="decr2"><b>underline:</b> 下線が付きます。</p> <p class="decr3"><b>overline:</b> 上線が付きます。</p> <p class="decr4"><b>line-through:</b> 打ち消し線が付きます。</p> <p class="decr5"><b>blink:</b> Firefox・Opera の以前のバージョンでは点滅します。</p> <p class="decr6"><b>underline overline line-throughk:</b> 下線・上線・打ち消し線が付きます。</p> |
ブラウザー 表示例 (未対応のブラウザーでは正しく表示できません) |
---|
none: 線は付かず,点滅もしません。 初期値。 underline: 下線が付きます。 overline: 上線が付きます。 line-through: 打ち消し線が付きます。 blink: Firefox・Opera の以前のバージョンでは点滅します。 underline overline line-throughk: 下線・上線・打ち消し線が付きます。 |