textDecorationLine Property - Javascript CSS Style Property

Javascript examples for CSS Style Property:textDecorationLine

  1. HOME
  2. Javascript
  3. CSS Style Property
  4. textDecorationLine

Description

The textDecorationLine property sets or gets what type of line for the decoration.

Property Values

ValueDescription
none Default value. Specifies no line for the text-decoration
underlineSets that a line will be displayed under the text
overline Sets that a line will be displayed over the text
line-through Sets that a line will be displayed through the text
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

Technical Details

Item Value
Default Value: none
Return Value: A String, representing the text-decoration-line property of an element
CSS VersionCSS3

Display paragraphs with a line on top:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
p#myP {/*from  w w  w . java 2s .  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>

Related Tutorials