移动设备的风格

Question

我正在尝试让我的一些网站更加适合移动设备。所以我创建了一个新的样式表，重新组织页面，使其更加垂直。当我在Firefox的响应式设计视图中测试它时，一切看起来都不错。但是，当我尝试使用手机时，它无法正常工作，但只是正常显示网站，难以阅读。我包括这样的样式表：

<link type="text/css" rel="stylesheet" media="screen and (min-width: 600px)"
      href="/static/themes/pauline/style.css"/>
<link type="text/css" rel="stylesheet" media="handheld, screen and (max-width: 599px)"
      href="/static/themes/pauline/handheld.css"/>

如果我想在iPhone等上运行，我的媒体查询是否有问题？

Answer 1

将以下代码添加到您的html页面中。

<meta name="viewport" content="width=device-width">

它将呈现具有自己屏幕宽度的页面。