使用像这样的基本结构:
<div class="col-md-6">
<h1>Some Text</h1>
</div>
以 bootstrap 作为默认 css 并添加 css:
h1 { 5vw; }
现在在移动设备上这是一个完美的尺寸，在桌面上它太大了。将它更改为 1.5vw 非常适合桌面，但在移动设备上太小了。获得我在示例中看到的这种大小的诀窍是什么？
请注意，在 bootstrap 的 col-md-6 上，父级的样式默认为 50%。
最佳答案
1 个 vw 单位等于视口(viewport)宽度的 1%，因此如果您将其设置为 5vw，则实际上是将其设置为视口(viewport)总宽度的 5%，即桌面的 5%宽度将大于移动设备宽度的 5%。
您需要使用媒体查询来定位您的特定断点并相应地调整您的 vw 单位。
CSS Tricks 在此处提供了有关常用媒体查询的重要资源:Media Queries for Standard Devices
关于css - 使用 vw 的字体缩放在移动设备上是正确的，但在桌面设备上太大了？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31167661/