HTML DOM Style textDecorationStyle Property Last Updated : 29 Jan, 2024 Comments Improve Suggest changes Like Article Like Report The Style textDecorationStyle property in HTML DOM is used to set the decoration of text with different kinds of lines. It can display the line in various styles like a single line, double line, wavy, etc. By using this property, we can display the line in a specified style. Syntax: It returns the textDecorationStyle property. object.style.textDecorationStyleIt is used to set the textDecorationStyle property. object.style.textDecorationStyle = "solid | double | dotted | dashed | wavy | initial | inherit"Property Values: Property Value Description solid It is used to display a line as a single line. It is a default value. double It is used to display line as a double line. dotted It is used to display line as a dotted line. dashed It is used to display line as a dashed line. wavy It is used to display line as a wavy line . initial It sets the textDecorationStyle property to its default value. inherit This property is inherited from its parent element. Return Value: It returns string that represents a textDecorationStyle property of an element. Example 1: This example describes how to set the text deecoration style on text using textDecorationStyle property. html <!DOCTYPE html> <html> <head> <title>HTML DOM Style textDecorationStyle Property</title> <style> body { text-align: center; } #GFG { text-decoration: underline; } </style> </head> <body> <h1>GeeksforGeeks</h1> <h2>HTML DOM Style textDecorationStyle Property</h2> <p id="GFG"> A Computer Science Portal for Geeks </p> <button onclick="myGeeks()"> Click Here! </button> <script> function myGeeks() { // Set textDecorationStyle Property document.getElementById("GFG").style .textDecorationStyle = "double"; } </script> </body> </html> Output: Example 2: Change the text decoration style using textDecorationStyle property. html <!DOCTYPE html> <html> <head> <title>HTML DOM Style textDecorationStyle Property</title> <style> body { text-align: center; } #GFG { text-decoration: underline; } </style> </head> <body> <h1>GeeksforGeeks</h1> <h2>HTML DOM Style textDecorationStyle Property</h2> <p id="GFG"> A Computer Science Portal for Geeks </p> <button onclick="myGeeks()"> Click Here! </button> <script> function myGeeks() { // Set textDecorationStyle Property document.getElementById("GFG").style .textDecorationStyle = "wavy"; } </script> </body> </html> Output: Supported Browsers: Google Chrome 57Edge 79Firefox 36Opera 44Safari 12.1 Comment More infoAdvertise with us Next Article HTML | DOM Style columnCount Property B bestharadhakrishna Follow Improve Article Tags : Technical Scripter Web Technologies HTML HTML-DOM HTML-Property +1 More Similar Reads HTML DOM TransitionEvent elapsedTime Property The Transition Event elapsedTime property returns the duration in seconds that a CSS transition has been running when the transition event is fired. It is useful for tracking the timing of transition animations.Syntax :event.elapsedTimeReturn Value: It returns transition duration in seconds when eve 1 min read HTML DOM characterSet Property The characterSet property is used to return the character encoding for the document at the time of parsing. It is the character set that has been used for the document rendering also the user can override the encoding. The characterSet property will return null if the document is created in memory.S 2 min read HTML DOM | Style pageBreakBefore Property The Style pageBreakBefore property is used for setting or returning the page-break behavior before an element in printing or print preview. The Style pageBreakBefore property does not affect the absolutely positioned elements. Syntax : object.style.pageBreakBefore Return Values: It returns a string, 2 min read HTML DOM | Style pageBreakInside Property The Style pageBreakInside property is used for setting or returning the page-break behavior inside an element in printing or print preview. The Style pageBreakInside property does not affect the absolutely positioned elements. Syntax : To get the property:object.style.pageBreakInsideTo set the prope 2 min read HTML | DOM Style columnCount Property The DOM Style columnCount property specifies a number that defines the number of columns an element should be divided into. Syntax : To return the value: object.style.columnCount To set the value: object.style.columnCount = "number|auto|initial|inherit" Property Values: number: Specifies the number 4 min read HTML | DOM Style backgroundSize Property The HTML DOM Style backgroundSize Property is used to set or return the size of the background image. Syntax: To get the backgroundSize propertyobject.style.backgroundSizeTo set the backgroundSize propertyobject.style.backgroundSize = "auto | length | percentage | cover| contain |initial | inherit" 6 min read HTML | DOM Style font Property The HTML DOM Style's font property is used to change the element's font properties. It can be used to change the font style, weight, size, and family. Syntax: To set the font style :node.style.font = "font-properties font-size font-family;"To get the current font style:node.style.font; Return Values 2 min read HTML | DOM Style lineHeight Property The Style lineHeight property is used for setting or returning the distance between lines in a text. It is a string which represents the distance between lines in the text. To return the line-height.object.style.lineHeightTo set the line-height.object.style.lineHeight = "normal|number|length|%|initi 2 min read HTML DOM Style maxWidth Property The maxWidth property of HTML DOM sets/returns the maximum width of an element. The maxWidth property affects only block-level elements, absolute or fixed position elements. Syntax: It returns the maxWidth property.object.style.maxWidthIt sets the maxWidth Property.object.style.maxWidth = "none | le 2 min read HTML | DOM AnimationEvent In the HTML document, AnimationEvent interface is used to represent events providing information related to animations. AnimationEvent contains properties such as animationName, elapsedTime and pseudoElement. animationName: The animationName property returns the name of the event animation. It retur 2 min read Like