如何可靠地取得和更改 HTML 中的字體大小？

取得 HTML 中的字體大小值

在 Web 開發中經常出現存取和操作 HTML 元素字體大小的需求。為了有效地做到這一點，了解底層機制和潛在的陷阱至關重要。

嘗試直接從 style.fontSize 屬性檢索字體大小可能無法總是提供所需的結果。如果在樣式表中定義字體大小，則屬性值將為空字串。為了避免此問題，建議使用 window.getCompulatedStyle 方法。下面的程式碼示範如何正確取得和調整字體大小：

var el = document.getElementById('foo');
var style = window.getComputedStyle(el, null).getPropertyValue('font-size');
var fontSize = parseFloat(style); // Convert the value to a float for precision
el.style.fontSize = (fontSize + 1) + 'px'; // Apply the updated font size

此方法可確保準確檢索字體大小，即使它是從樣式表繼承的。 parseFloat 函數用於將字串值轉換為浮點數，從而允許對字體大小進行更細粒度的調整。透過利用這種技術，您可以輕鬆修改 HTML 元素的字體大小並保持與樣式表定義的一致性。

以上是如何可靠地取得和更改 HTML 中的字體大小？的詳細內容。更多資訊請關注PHP中文網其他相關文章！