如何获得元素的“指定”样式而不是计算样式

Question

在不包含viewport元标记的网页上，大多数移动浏览器会将页面上的部分或所有字体“提升”到比css指定的大小。例如，在移动Safari上，指定大小的7px将被提升到类似于12px的大小。

您可以使用getComputedStyle读取升压值。我的问题是，有没有一种可靠的方法来读出未提升的价值？也就是说，如果字体被提升到12，我想知道它从7开始。

Answer 1

只是简单的回答。简而言之:你不能用今天的API获得特定的样式，我可以通过使用文本大小调整 (前缀为-webkit- for Safari)暂时关闭字体提升来解决我的具体问题。

Answer 2

Webkit有一个不推荐的函数，用于获取元素window.getMatchedCSSRules(<<element>>)的所有样式表规则。您可以使用它来获取规则列表，并循环它们来打印或处理每个规则的属性。您还需要考虑元素的style属性。

要处理font-size场景，我认为最好的方法是获取所有适用于元素的规则，按优先级排序(记住要考虑style属性和!important标志，然后选择值。

但是，这并不完全可靠，因为它是一个Webkit函数，而且它即将退出。有关于如何挖掘规则的这里的一堆讨论。一旦您有了元素的规则，这只是挑选您需要的特定信息的问题。