text-decoration: ***;
| Browser |
|
|---|
The text-decoration property adds decoration to text.
p {
text-decoration: underline;
}
| Property | Value | Explanation |
|---|---|---|
| text-decoration | underline | horizontal line under the text |
| overline | horizontal line over the text | |
| line-through | horizontal line through the text | |
| blink | blinking text (Firefox and Opera only) | |
| none | normal text (default) |
If you set two or more values, separate by a space.
text-decoration: underline overline;
Example
<html>
<head>
<title>TAG index</title>
<style type="text/css">
#example1 { text-decoration: underline; }
#example2 { text-decoration: overline; }
#example3 { text-decoration: line-through; }
#example4 { text-decoration: blink; }
#example5 { text-decoration: underline overline; }
#example6 { text-decoration: none; }
</style>
</head>
<body>
<p id="example1">A line under the text</p>
<p id="example2">A line over the text</p>
<p id="example3">A line through the text</p>
<p id="example4">A blinking text</p>
<p id="example5">A line under and over the text</p>
<p><a href="index.html" id="example6">Removes the links underline</a></p>
</body>
</html>
- Output
-
A line under the text
A line over the text
A line through the text
A blinking text
A line under and over the text