gpt4 book ai didi

html - 响应宽度在手机上太小,但在桌面浏览器上没问题

转载 作者:行者123 更新时间:2023-11-28 12:49:40 26 4
gpt4 key购买 nike

我正在练习响应式网页设计。据我目前所学,它围绕着一个带有流动组件和 CSS 媒体查询的流动网格。

当我缩小浏览器时,该网站看起来就像我希望它在手机上的样子:

browser

但是,在我的手机上,放在我的网络服务器上后,它看起来完全不同:

enter image description here

我认为宽度和设备宽度之间存在一些冲突。有谁知道出了什么问题吗?

这是我加载样式表的方式:

<link href="/stylesheets/index.css" rel="stylesheet" type="text/css" /> 
<link href="/stylesheets/mobile.css" rel="stylesheet" type="text/css" media="screen and (max-width: 600px), screen and (max-device-width: 600px)" />

最佳答案

没有viewport meta标签就没有responsive

<meta name="viewport" content="width=device-width, user-scalable=no">

有关视口(viewport)元标记的更多信息 https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag

关于html - 响应宽度在手机上太小,但在桌面浏览器上没问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24195904/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com