如何獲取元素的“指定”樣式而不是計算樣式

Question

在不包含viewport元標記的網頁上，大多數移動瀏覽器會將頁面上的部分或全部字體“提升”到大於css指定的大小。 例如，在移動Safari上，指定大小的7px將被提升到12px 。

您可以使用getComputedStyle讀出提升值。 我的問題是，有沒有一種可靠的方法可以讀出未提升的價值？ 即如果字體被提升到12，我想知道它從7開始。

Answer 1

Webkit有一個不推薦使用的函數來獲取元素的所有樣式表規則： window.getMatchedCSSRules(<<element>>) 。 您可以使用它來獲取規則列表並循環遍歷它們以打印或處理每個規則的屬性。 您還需要考慮元素的style屬性。

為了處理你的font-size場景，我想最好的方法是獲得適用於元素的所有規則，按優先級排序它們（記住考慮style屬性和!important標志，然后選擇值。

但這並不完全可靠 ，因為它是一個Webkit函數，它正在逐漸消失。 這里有一堆關於如何規避規則的討論 。 獲得元素規則后，只需選擇所需的特定信息即可。

Answer 2

這里只是一個快速的答案。 簡而言之：您無法使用今天的API獲得指定的樣式。 我能夠暫時關閉使用的字體，提高解決我的特定問題的文字大小調整 （用-webkit-前綴的Safari瀏覽器）。