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

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浏览器）。