Question

这是我在桌面浏览器上的截图

enter image description here

桌面浏览器上的一切看起来都很棒。但是当我在移动浏览器上查看时，布局变得非常小。所以我错过了html / css代码中的一些东西，因为这个网站基本上我只使用普通的html / css没什么特别的。

有人能指出我吗？感谢

Answer 1

确保在<head>中设置以下视口元标记，否则文字会太小：

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

Answer 2

当浏览器窗口使用@media queries变为特定大小时调整元素大小。

@media screen and (max-width: 500px) {
  div {
    width: 400px;
  }
}

Answer 3

实际上，网站的移动视图优化是一个详细而广泛的主题，但对于您的情况，我的建议是稍微增加您的字体。