- Data Structure
- Networking
- RDBMS
- Operating System
- Java
- MS Excel
- iOS
- HTML
- CSS
- Android
- Python
- C Programming
- C++
- C#
- MongoDB
- MySQL
- Javascript
- PHP
- Physics
- Chemistry
- Biology
- Mathematics
- English
- Economics
- Psychology
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
HTML DOM Style tabSize Property
The HTML DOM Style tabSize property returns and modify the length of the space used for the tab character in an HTML document.
Syntax
Following is the syntax −
1. Returning tabSize
object.tabSize
2. Modifying tabSize
object.tabSize = “value”
Here value can be −
Value | Explanation |
---|---|
initial | It set this property value to its default value. |
inherit | It inherits this property value from its parent element. |
length | It specifies the length of a tab character. |
number | It specifies the number of space-characters that should be displayed for each tab-character in an HTML document. |
Let us see an example of HTML DOM Style tabSize Property −
Example
<!DOCTYPE html> <html> <style> body { color: #000; height: 100vh; } .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; margin: 1rem 0; } .square { width: 100px; height: 100px; background: #db133a6b; position: relative; } .show { font-size: 1.2rem; margin: 1rem 0; } </style> <body> <h1>DOM Style tabSize Property Demo</h1> <pre>I'mpreelement.</pre> <button onclick="set()" class="btn">Change tabSize</button> <script> function set() { document.querySelector('pre').style.tabSize = "20"; } </script> </body> </html>
Output
Click on “Change tabSize” button to change the tabSize of pre element.
Advertisements