在div层中缩放文本与容器bg-image成比例

Question

以下问题： 我有一个包含大量div的滚动页面。每个div都有一个bg-image和另一个带有文本的div。

 <div id="intro">
            <h1>blabla</h1>
            <p id="text1_1"> another bla bla </p>
            <p id="text1_2"> and again bla </p>
 </div>

我使用css3的background-size: cover;处理bg图像缩放，当我缩放浏览器窗口时，文本不会保持在同一位置，并且不会与bg图像成比例地调整大小。 什么是最好的方法呢？ 感谢

Answer 1

遗憾的是，没有CSS方法可以解决您的问题。有一个jQuery插件可以帮助你，称为FitText。

问题是，为了实现这一点，font-size属性应该是灵活的，而现在却不是。只有CSS才能解决这个问题的唯一方法 - 如果你正在寻找这样的解决方案 - 是在较小的视口中进行媒体查询并减少字体大小，但这只会使文本自适应。