Javascript Reference - HTML DOM Style textDecorationLine Property

The textDecorationLine property sets or gets the style of decoration line.

Browser Support


`textDecorationLine`	No	No	No (Use MozTextDecorationLine)	No	No

Syntax

Return the textDecorationLine property:

var v = object.style.textDecorationLine

Set the textDecorationLine property:

object.style.textDecorationLine='none|underline|overline|line-through|initial|inherit'

Property Values

Value	Description
none	Default value. No line
underline	a under line
overline	a over line
line-through	a through line
initial	Set to default value.
inherit	Inherit from its parent element.

Technical Details

Default Value:	none
Return Value:	A string representing the text-decoration-line property
CSS Version	CSS3

Example

The following code shows how to display a line on text top.


<!DOCTYPE html>
<html>
<head>
<style>
p#myP {<!--from   ww w .j a  va 2 s. c  o m-->
    text-decoration: underline;
}
</style>
</head>
<body>
<p id="myP">
Hello world!
</p>
<button onclick="myFunction()">test</button>
<script>
function myFunction() {
    document.getElementById("myP").style.MozTextDecorationLine = "overline"; // Code for Firefox
    document.getElementById("myP").style.textDecorationLine = "overline";
}
</script>
</body>
</html>

The code above is rendered as follows: