คุณสมบัติ tabSize HTML DOM Style ส่งคืนและแก้ไขความยาวของช่องว่างที่ใช้สำหรับอักขระแท็บในเอกสาร HTML
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์ -
1. กลับขนาดแท็บ
object.tabSize
2. แก้ไขขนาดแท็บ
object.tabSize = “value”
ค่านี้สามารถเป็น −
ค่า | คำอธิบาย |
---|---|
เริ่มต้น | ตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น |
สืบทอด | รับค่าคุณสมบัตินี้จากองค์ประกอบหลัก |
ความยาว | ระบุความยาวของอักขระแท็บ |
หมายเลข | ระบุจำนวนอักขระช่องว่างที่ควรแสดงสำหรับแต่ละอักขระแท็บในเอกสาร HTML |
ให้เรามาดูตัวอย่าง HTML DOM Style tabSize Property -
ตัวอย่าง
<!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>