CSS text-decorationプロパティ
例
h1、h2、h3、h4 要素のテキスト装飾を設定する:
h1 {text-decoration:overline}
h2 {text-decoration:line-through}
h3 {text-decoration:underline}
試してみる »
プロパティの定義と使用説明
text-decoration プロパティは、テキストに追加する装飾(下線、上線、取り消し線など)を指定します。
text-decoration プロパティは、次の3つのプロパティの省略形です:
構文
/*关键值*/ text-decoration: none; /*没有文本装饰*/ text-decoration: underline red; /*红色下划线*/ text-decoration: underline wavy red; /*红色波浪形下划线*/ /*全局值*/ text-decoration: inherit; text-decoration: initial; text-decoration: unset;
| デフォルト値: | none |
|---|---|
| 継承: | no |
| バージョン: | CSS1 |
| JavaScript 構文: | object.style.textDecoration="overline" |
ブラウザサポート
表内の数字は、そのプロパティをサポートする最初のブラウザバージョンを示します。
| プロパティ | |||||
|---|---|---|---|---|---|
| text-decoration | 1.0 | 3.0 | 1.0 | 1.0 | 3.5 |
プロパティ値
| 值 | 説明 |
|---|---|
| none | デフォルト。標準のテキストを定義します。 |
| underline | テキストの下に線を定義します。 |
| overline | テキストの上に線を定義します。 |
| line-through | テキストを貫く線を定義します。 |
| blink | 点滅するテキストを定義します。 |
| inherit | text-decoration プロパティの値を親要素から継承することを指定します。 |
その他の例
例
h1.under {
text-decoration: underline;
}
h1.over {
text-decoration: overline;
}
p.line {
text-decoration: line-through;
}
p.blink {
text-decoration: blink;
}
a.none {
text-decoration: none;
}
p.underover {
text-decoration: underline overline;
}
試してみる »
例
破線と波線:
h1 {
text-decoration: underline overline dotted red;
}
h2 {
text-decoration: underline overline wavy blue;
}
試してみる »
関連記事
CSS チュートリアル:CSS テキスト
その他の拡張