html - 响应式设计/视口(viewport)

Question

假设我有一个网站，在其移动 View 中看起来像这样:

使字体更具可读性的最佳方法是什么？

当前视口(viewport)配置如下:

<meta name="viewport" content="width=1366, user-scalable=yes">

将其更改为

<meta name="viewport" content="width=device-width, initial-scale=1">

有什么区别吗？是否有任何在线模拟器可以向我展示该网站在该视口(viewport)下的外观？显然我是新手，但到目前为止我一直在使用 mobilephoneemulator.com，在那里我可以看到我对 CSS 所做的更改，但看不到对视口(viewport)的更改。

我也试过增加字体，但似乎必须将字体大小增加到一个较大的值才能使文本可读，所以这就是为什么我认为问题可能出在视口(viewport)或其他方面比字体的大小。

Answer 1

文本这么小的原因是你告诉浏览器手机的宽度是 1366px 基本上从网站缩小。
所以是的，使用:

<meta name="viewport" content="width=device-width, initial-scale=1"> 

应该可以解决问题。