HTML | DOM Style tabSize Property
The Style tabSize property in HTML DOM is used to set or return the length of the space used in place of the tab character.
Syntax:
- To get the tabSize property
object.style.tabSize
- To set the tabSize property
object.style.tabSize = "number|length|initial|inherit"
Property Values
- number: It is used to specify the number of space characters to be used for each tab character. The default value is 8.
- length: This is used to specify the length of the tab character. This value is not currently supported by most browsers.
- initial: This is used to set the property to its default value.
- inherit: This is used to inherit the value from the element’s parent.
Example 1: Using “number” property.
HTML
<!DOCTYPE html><html><head> <title> DOM Style tabSize Property </title></head><body> <h1 style="color: green"> w3wiki </h1> <b> DOM Style tabSize Property </b> <p> The tabSize property specifies the amount of space to be used for the tab character. </p> <pre id="ts"> Beginner For Beginner </pre> <button onclick="GFG()"> Change </button> <script> function GFG() { ele = document.getElementById("ts"); ele.style.tabSize = "16" } </script></body></html> |
Output:
- Before clicking the button:
- After clicking the button:
Example 2: Using “initial” property.
HTML
<!DOCTYPE html><html><head> <title> DOM Style tabSize Property </title> <style> #ts { tab-size: 16; } </style></head><body> <h1 style="color: green"> w3wiki </h1> <b>DOM Style tabSize Property</b> <p> The tabSize property specifies the amount of space to be used for the tab character. </p> <pre id="ts"> Beginner For Beginner </pre> <button onclick="GFG()">Change</button> <script> function GFG() { ele = document.getElementById("ts"); ele.style.tabSize = "initial" } </script></body></html> |
Output:
- Before clicking the button:
- After clicking the button:
Supported Browsers: The browser supported by DOM Style tabSize Property are listed below:
- Chrome 21
- Edge 79
- Firefox 91
- Opera 15
- Safari 7
Contact Us