คุณสมบัติ HTML DOM Style fontSizeAdjust ใช้สำหรับกำหนดขนาดของฟอนต์ตามความสูงของอักษรตัวพิมพ์เล็ก x และตัวพิมพ์ใหญ่ X ซึ่งให้การควบคุมขนาดฟอนต์ได้ดีกว่าคุณสมบัติ fontSize
หมายเหตุ:คุณสมบัตินี้รองรับใน Mozilla Firefox เท่านั้น
ต่อไปนี้เป็นไวยากรณ์สำหรับ −
การตั้งค่าคุณสมบัติ fontSizeAdjust -
object.style.fontSizeAdjust = "none|number|initial|inherit"
อธิบายคุณสมบัติข้างต้นดังนี้ −
| ค่า | คำอธิบาย |
|---|---|
| ไม่มี | ไม่มีการปรับเปลี่ยนขนาดฟอนต์และเป็นค่าเริ่มต้น |
| หมายเลข | ใช้สำหรับคำนวณอัตราส่วนค่าขนาดโดยหารขนาดฟอนต์แรก x-height ด้วยอันที่สองแล้วคูณด้วยตัวเลขที่ให้มา |
| ค่าเริ่มต้น | การตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น |
| สืบทอด | การสืบทอดค่าคุณสมบัติหลัก |
ให้เราดูตัวอย่างคุณสมบัติ fontSizeAdjust -
ตัวอย่าง
<!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="The fontSizeAdjust property for the above text inside div is increased to 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>Change the above div text fontSizeAdjust property by clicking the below button</p>
<button onclick="adjustFontSize()">Change fontSizeAdjust </button>
<p id="Sample"></p>
</body>
</html> ผลลัพธ์
เมื่อคลิกปุ่ม “เปลี่ยนขนาดแบบอักษรปรับ ปุ่ม −
