响应式布局
本话题发布响应式布局相关的问答文章和技术分享，将持续更新，为您推荐了11篇问答，访问即可查看更多精彩内容。
-
1
回答
27浏览
为什么我的Vue页面在手机上布局会错乱？
我用 Vue 写了个简单的商品卡片，在电脑浏览器看是正常的，但一到手机上就文字重叠、图片变形，明明用了百分比和 max-width 啊……试过加 viewport meta 也没用。 这是我的组件代码...
-
1
回答
41浏览
用 vw 做响应式布局在 iOS 上高度计算不对怎么办？
我在 Vue 项目里用 vh 设置页面高度，结果在 iPhone 上显示不全，底部被截掉了。安卓和桌面浏览器都正常，就 iOS Safari 出问题。试过用 100vh，也试过动态计算 window....
-
2
回答
70浏览
响应式断点设置后在手机上没生效？
我用媒体查询写了几个断点，比如 @media (max-width: 768px)，在浏览器开发者工具里切换设备看起来没问题，但真机测试时样式完全没变，还是桌面端的布局。 是不是我写法有问题？或者 m...
-
1
回答
104浏览
弹性布局中子元素宽度不按预期收缩怎么办？
我在做移动端商品列表，用 flex 布局让三个卡片平分一行，但内容多的卡片会撑开，导致其他卡片被压缩甚至换行。明明设了 flex: 1，为啥不均分？ 试过加 min-width: 0 也没用，布局在 ...
-
2
回答
33浏览
响应式布局中图片怎么才能真正自适应容器？
我在做移动端页面时，发现图片在不同屏幕宽度下总是超出容器或者变形，明明用了 max-width: 100% 啊，但还是不行。试过 object-fit 也没效果，是不是哪里写错了？ 这是我的代码： &...
-
2
回答
26浏览
响应式断点设置后，为什么在手机上还是显示桌面样式？
我用媒体查询设置了移动端的断点，但用手机访问时布局还是按桌面端渲染，试了几个不同设备都一样，是不是哪里写错了？ 下面是我写的 HTML 和内联的 CSS： <style> @media (...
-
2
回答
48浏览
媒体查询在 Vue 组件里为啥不生效？
我在 Vue 单文件组件里写了媒体查询，但不管怎么缩放屏幕，样式都没变化，是不是写法有问题？ 试过把 CSS 放在 <style> 里，也加了 scoped，但断点完全没触发： <t...
-
1
回答
89浏览
React用vw/vh布局时滚动条出现页面错位怎么办？
我在做移动端页面时用了100vh设置容器高度，但页面出现滚动条后底部元素就被截断了，试过calc(100vh - env(safe-area-inset-bottom))也不管用，求大神指点 比如这个...
-
2
回答
67浏览
rem和em在移动端响应式布局中如何配合使用？
最近在做移动端适配时发现一个问题，当同时使用rem和em时，字体大小总是忽大忽小。比如设置了html{font-size:16px}，然后用em的子元素又套了rem，结果在iPhone12上显示正常，...
-
2
回答
75浏览
aspect-ratio设置后图片在移动端显示变形怎么办？
我在做移动端卡片布局时用了aspect-ratio属性，但图片总是变形。比如这个卡片： .card-container { aspect-ratio: 16/9; position: relative...
-
2
回答
73浏览
为什么用百分比布局时子元素宽度总是超出父容器？
大家好，我在做移动端导航栏时遇到问题。父容器设了width: 100%，里面三个子元素各占33.33%宽度，但实际显示时第三个元素会挤到下一行去。 我已经试过给父容器加font-size: 0解决子元...
