html - 为什么我的网站在移动设备上会这样?

标签 html css mobile layout

所以我刚刚为我妈妈完成了一个网站,我打算在她生日那天送给她。这是一个包含四首诗、简单布局、纯 HTML 和 CSS 的网站。

它在桌面上看起来很不错,但我希望她可以随时通过手机访问该网站,所以我尽力让它响应迅速。

现在,当我在我的笔记本电脑上打开这个网站并调整窗口大小以模拟移动屏幕时,布局会增加,这正是我想要的。

但是,当我在 iPhone 上访问该网站时,一切都太小了,我必须捏合并放大。

为什么会这样?这与我的 CSS 有关吗?

您可以在这里访问网站:http://www.devericx.com

最佳答案

看来您需要使用视口(viewport)元标记。在head下添加这个标签

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

您可以找到更多相关信息here .

关于html - 为什么我的网站在移动设备上会这样?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31867861/

相关文章:

html - 悬停边界位置

html - 背景图片 url 链接问题

performance - 提高移动 Web 性能的一般方法

javascript - 如何将 'swipe/touch' 添加到 'jquery circular carousel'

javascript - 在 img 标签中显示 mjpeg 的替代方案(使用基本身份验证)

html - 创建出色的解析器 - 从 HTML/博客中提取相关文本

html - 如何选择或选择或使用移动日期选择器

html - span标签有什么用?

php - 动态插入 MySQL-PHP 组合

java - 在我的 mainActivity 中找不到 DataBindingUtil