这是我的CSS：
@media(max-width:767px){body { font-size: 22px; }}
@media(min-width:768px){body { font-size: 20px; }}
@media(min-width:992px){body { font-size: 16px; }}
当我在笔记本电脑上调整浏览器窗口大小时，它会正确调整大小。但这是我的问题：当我从我的移动设备访问我的网站时，字体太小（我不知道为什么但是我的移动设备上的22px太小而我必须按顺序放大正确看待它。当我将较小屏幕宽度的字体大小增加到40px时，它在我的移动设备上看起来不错，但当我从笔记本电脑访问网站并将浏览器窗口调整为更小的宽度时，40px就是这样太大了，最终会占据整个屏幕。
我的移动设备上的22px看起来很小。有没有办法（使用Bootstrap或纯CSS）来解决这个问题？问题是，22px太小但40px在我的移动设备上是完美的。但是，在我的计算机上却完全相反（22px是完美的，但40px太大了）。答案 0 :(得分：3)
您是否尝试过设置视口？
<meta name="viewport" content="width=device-width, initial-scale=1">
请参阅developer.mozilla.org/en-US/docs/Mozilla/Mobile /