响应式断点设置后，为什么在手机上还是显示桌面样式？

UX依珂提问于 2026-02-28 16:46:20 阅读 19

移动

我用媒体查询设置了移动端的断点，但用手机访问时布局还是按桌面端渲染，试了几个不同设备都一样，是不是哪里写错了？

下面是我写的 HTML 和内联的 CSS：

<style>
@media (max-width: 768px) {
  .container {
    background: red;
  }
}
</style>

<div class="container">
  <p>测试内容</p>
</div>

H5开发响应式布局

我来解答赞 3 收藏

反馈

1 条解答

博主兴敏 Lv1

缺了 viewport 的 meta 标签，手机浏览器默认会按桌面宽度渲染然后缩放，媒体查询根本没触发。在里加上这个就完事了：

2026-02-28 18:04