CSS Textdekoration
Das CSS Textdekoration Modul definiert Funktionen im Zusammenhang mit Textdekorationen, wie z.B. Unterstreichungen, Textschatten und Betonungsmarkierungen.
Referenz
Eigenschaften
text-decoration
text-decoration-color
text-decoration-line
text-decoration-skip
text-decoration-skip-ink
text-decoration-style
text-decoration-thickness
text-emphasis
text-emphasis-color
text-emphasis-position
text-emphasis-style
text-shadow
text-underline-offset
text-underline-position
Die Spezifikation definiert auch die text-decoration-skip-box
, text-decoration-skip-self
, text-decoration-skip-spaces
, text-decoration-trim
und text-emphasis-skip
Eigenschaften, die von keinem Browser bisher unterstützt werden.
Beispiele
css
.under {
text-decoration: underline red;
}
.over {
text-decoration: wavy overline lime;
}
.line {
text-decoration: line-through;
}
.plain {
text-decoration: none;
}
.underover {
text-decoration: dashed underline overline;
}
.thick {
text-decoration: solid underline purple 4px;
}
.blink {
text-decoration: blink;
}
html
<p class="under">This text has a line underneath it.</p>
<p class="over">This text has a line over it.</p>
<p class="line">This text has a line going through it.</p>
<p>
This <a class="plain" href="#">link will not be underlined</a>, as links
generally are by default. Be careful when removing the text decoration on
anchors since users often depend on the underline to denote hyperlinks.
</p>
<p class="underover">This text has lines above <em>and</em> below it.</p>
<p class="thick">
This text has a really thick purple underline in supporting browsers.
</p>
<p class="blink">
This text might blink for you, depending on the browser you use.
</p>
Spezifikationen
Specification |
---|
CSS Text Decoration Module Level 3 |
CSS Text Decoration Module Level 4 |
Siehe auch
- CSS Fonts Modul
- CSS Ruby Layout Modul
- CSS Text Modul
- CSS Schreibmodi Modul