Html @媒体在手机上不工作，但在桌面上工作_Html_Css_Media Queries

Html @媒体在手机上不工作，但在桌面上工作

html css

Html @媒体在手机上不工作，但在桌面上工作,html,css,media-queries,Html,Css,Media Queries,我创建了我的网站，并希望它对手机友好。所以我创建了一个媒体查询并开始使用它。缩放浏览器窗口时进行检查如果我在手机上查看同一页，它不会改变布局我看不出我遗漏了什么。以下是我所拥有的： HTML: 希望我错过了一件小事：-） M.试试这个 @media only screen and (max-width:768px) { ... } 或听起来您需要告诉设备使用其实际像素宽度： <meta name="viewport" content="width=device-width, i

我创建了我的网站，并希望它对手机友好。
所以我创建了一个媒体查询并开始使用它。缩放浏览器窗口时进行检查

如果我在手机上查看同一页，它不会改变布局

我看不出我遗漏了什么。
以下是我所拥有的：
HTML:

希望我错过了一件小事：-）

试试这个

@media only screen and (max-width:768px) { ... }

或

听起来您需要告诉设备使用其实际像素宽度：

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

一些设备会呈现页面，假设它们没有针对移动设备进行优化。将该元标记放入您的

标记中，并告知我们是否修复了它。更多信息。

尝试将其添加到代码中：

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

手机屏幕有多宽？比768px小。。。它是320px，可能您的手机不支持vw

vw

？这是丢失的。非常感谢。

@media only screen and (min-width:320px) { ... }

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

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