คุณสมบัติ HTML DOM Style fontSizeAdjust ใช้สำหรับตั้งค่าขนาดฟอนต์โดยอิงจากความสูงของตัวอักษร x พิมพ์เล็กและ X พิมพ์ใหญ่ ให้การควบคุมขนาดฟอนต์ดีกว่าคุณสมบัติ fontSize
หมายเหตุ: คุณสมบัตินี้รองรับเฉพาะ Mozilla Firefox เท่านั้น
ไวยากรณ์ (Syntax)
การตั้งค่าคุณสมบัติ fontSizeAdjust:
object.style.fontSizeAdjust = "none|number|initial|inherit"
ค่าของคุณสมบัติ (Property Values)
| ค่า | คำอธิบาย |
|---|---|
| none | ไม่ปรับขนาดฟอนต์ (ค่าเริ่มต้น) |
| number | ใช้คำนวณอัตราส่วน aspect value โดยการหาร x-height ของฟอนต์แรกด้วยฟอนต์ที่สองและคูณด้วยตัวเลขที่กำหนด |
| initial | ตั้งค่าคุณสมบัติเป็นค่าเริ่มต้น |
| inherit | สืบทอดค่าคุณสมบัติจากองค์ประกอบพาเรนต์ |
ตัวอย่างการใช้งาน
<!DOCTYPE html> <html> <head> <style>
.one {
font-family: verdana;
}
.two {
font-family: 'times new roman';
}
#demo1, #demo2 {
font-size-adjust: 0.5;
}
</style> <script>
function adjustFontSize() {
document.getElementById("demo1").style.fontSizeAdjust = "1";
document.getElementById("demo2").style.fontSizeAdjust = "1";
document.getElementById("Sample").innerHTML = "คุณสมบัติ fontSizeAdjust ของข้อความใน div เพิ่มเป็น 1 แล้ว";
}
</script> </head> <body>
<div class="one">This is demo text</div><br/>
<div id="demo1" class="one">This is demo text</div><br/>
<div class="two">This is demo text</div><br/>
<div id="demo2" class="two">This is demo text</div>
<p>คลิกปุ่มด้านล่างเพื่อเปลี่ยนคุณสมบัติ fontSizeAdjust ของข้อความใน div</p>
<button onclick="adjustFontSize()">เปลี่ยน fontSizeAdjust</button>
<p id="Sample"></p>
</body> </html>
ผลลัพธ์

เมื่อคลิกปุ่ม "เปลี่ยน fontSizeAdjust":
