Javascript Reference - HTML DOM Style textDecoration Property








The textDecoration property sets or gets one ore more decorations for a text.

Browser Support

textDecoration Yes Yes Yes Yes Yes

Syntax

Return the textDecoration property:

var v = object.style.textDecoration

Set the textDecoration property:

object.style.textDecoration=none|underline|overline|line-through|blink|initial|inherit

Property Values

ValueDescription
none a normal text. This is default
underline a line below the text
overline a line above the text
line-through a line through the text
blink a blinking text.
inherit inherit the text-decoration property from the parent element




Technical Details

Default Value: none
Return Value: A string representing the text decoration
CSS Version CSS1

Example

The following code shows how to set the text decoration for a <p> element


<!DOCTYPE html>
<html>
<body>
<p id="myP">This is an example paragraph.</p>
<button type="button" onclick="myFunction()">test</button>
<script>
function myFunction() {<!--from  w  w w  .j a  v a2 s. co m-->
    document.getElementById("myP").style.textDecoration = "underline overline";
}
</script>

</body>
</html>

The code above is rendered as follows:





Example 2

The following code shows how to get the text decoration of a <p> element


<!DOCTYPE html>
<html>
<body>
<!--   w ww  .  j a  v  a  2  s . c om-->
<p id="myP" style="text-decoration:line-through;">This is an example paragraph.</p>

<button type="button" onclick="myFunction()">test</button>

<script>
function myFunction() {
    console.log(document.getElementById("myP").style.textDecoration);
}
</script>

</body>
</html>

The code above is rendered as follows: