缩放浏览器

Question

基本上我已经在css中用百分比设置了我的html元素，如果我放大元素/框保持不变但文本刚刚过度膨胀/变得太大而且超出了框。

是否有任何方法可以将文本保留在内部并将其设置为max-font-size以放大以避免文本变得过大。

https://gist.github.com/seby1995/751e3eddcd12f24aeb7a

https://gist.github.com/seby1995/faaaf4ee2696aa051737

https://gist.github.com/seby1995/01adf5234cb55cd14a65

正常：

放大：

Answer 1

如果您希望在调整浏览器窗口大小时字体/元素成比例，则可以使用em代替px

这样做......

<div style="background:blue; width:5em; height:5em;">
  <span style="font-size: 1.7em; color:white;">foobar</span>
</div>

并在您的浏览器中使用键盘cmd/ctrl + +或cmd/ctrl + -调整大小，您将看到foobar在任何大小的盒子内都是完全相同的位置（除了可笑的小巧）