为什么当用于字体大小时calc不重新评估？ [英] Why calc is not reevaluated when it is used for font-size?

问题描述

我尝试使用VW和calc一起工作，但只计算一次：加载时间：

I tried to use VW and calc together and works but calculated only once: loading time:

http://codepen.io/anon/pen/mJOGbr

html{
  font-size: calc( 16px + 2vw ); 
}

如何在浏览器窗口调整大小时强制评估calc？
计算一次，但不会再次计算。
没有calc，VM工作正常...

How can I force to evaluate that calc any time the browser window is resized? It is evaluated once, but never again. Without calc, the VM works fine...

提前感谢！

推荐答案

请注意，如果您使用较旧的webkit浏览器，这个不调整大小的问题可能会发生。 查看此信息。 （滚动到Bugs！）

Note that if you are using an older webkit browser, this problem of not-resizing may occur indeed. See this post. (Scroll to "Bugs!")

Chrome 20+ / Safari 6+支持此功能， $ b相当重要的方式。当浏览器窗口调整大小时，字体
不会根据新的视口大小自行调整。规格
说：

The support is there in Chrome 20+ / Safari 6+, but it fails in one rather significant way. When the browser window is resized, the font doesn't adjust itself according to the new viewport size. The spec says:

当视口的高度或宽度改变时，它们被相应地缩放
。我窃听了它。也许不是一个巨大的灾难，因为它漂亮的
只是我们设计书呆子去调整浏览器窗口，
但仍然。

When the height or width of the viewport is changed, they are scaled accordingly. I bugged it. Perhaps not a huge disaster as it's pretty much just us design nerds that go around adjusting browser windows, but still. The font does adjust on a fresh page load.

要修复此问题（允许在不刷新页面的情况下调整大小），您需要
，元件。我使用jQuery，只是用
每个元素（不相关，在这种情况下）z-index值，触发
重新绘制。

To fix this issue (allow resizing without page refresh) you need to cause a "repaint" on the element. I used jQuery and just fiddled with each elements (irrelevant, in this case) z-index value, which triggers the repaint.

causeRepaintsOn = $("h1, h2, h3, p");

$(window).resize(function() {   causeRepaintsOn.css("z-index", 1); });

UPDATE ：不要担心这个问题，绝对不要强迫
那些重绘。此调整大小问题已在Chrome 34及更高版本和Safari
7+中修复。在移动设备上更改视口大小是不常见的，所以
我不知道这个错误是否影响了他们。

UPDATE: Don't worry about this anymore and definitely don't be forcing those repaints. This resizing issue is fixed in Chrome 34+ and Safari 7+. It's not common to change the viewport size on mobile devices, so I'm not sure if this bug ever effected them or not.

这篇关于为什么当用于字体大小时calc不重新评估？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！