如题，电脑浏览器打开网页正常，但手机浏览器打开原先在一行的两个col-sm-4变成了两行，如图
这是用电脑上的浏览器打开的，都正常
但是用手机的qq浏览器打开位置就乱了，电脑打开发大300%也会乱。
相关代码：
还请会的小伙伴不吝赐教~~感谢~~
CSS+div网页设计 电脑浏览器打开网页正常 但手机浏览器打开col-sm-4位置乱了
- 写回答
- 好问题 0 提建议
- 关注问题
分享- 邀请回答
-
6条回答 默认 最新
蚂蚁冲锋队 2017-08-29 10:05关注首先，浏览器不同对css+div的支持也不同，其次你的布局有没有做适配操作呢？不同分辨率下布局肯定也是不一样的，做了适配后统一用%来分配长高（具体做法可在网上找），
最后，bootstarp里面的css是可以根据自己的需求来改的，它里面都是用的px来做单位。根据上面三步的操作后一套界面便可以在手机、电脑、平版都浏览器上运行咯本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 无用评论 打赏举报 分享
- 2017-08-28 07:42回答 4 已采纳 **px是固定多少个像素 不会随着你的浏览器大小改动而改动 **%是当前div在上层div中的百分比会随着上层的大小而改动 位置要用相对位置 h2{position: absolute; top:
- 2021-11-08 21:55回答 1 已采纳 link写在head标签里面
- 2022-06-02 15:16回答 3 已采纳 <html> <head> <meta charset="utf-8" /> <title></title
- 2016-05-14 18:01Pluser的博客 CSS 多列等高，高度不一的列以等高方式布局。
- 2021-06-25 19:10回答 1 已采纳 样式不兼容问题。电脑的配置和尺寸不一样。你写的只适应你电脑的大小。
- 2022-06-17 09:15回答 2 已采纳 div +flex 布局 。还是建议自己做 遇到问题再问 直接给你 对你不好，你也掌握不了 。你可以参考这个 ，里面细致的布局 你自己来 。http://www.ruanyifeng.com/blog
- 2022-05-26 10:49回答 2 已采纳 div给个高度，还有，div里面是可以用p标签的 div{ height:300px }
- 2022-10-24 14:19xiaofeng123aazz的博客 状态逻辑难复用 在组件之间复用状态逻辑很难，可能要用到 render props （渲染属性）或者 HOC（高阶组件），但无论是渲染属性，还是高阶组件，都会在原先的组件外包裹一层父容器（一般都是 div 元素），导致层级...
- 2022-01-11 10:11回答 3 已采纳 估计你这个css样式是根据上一个页面传过来的参数进行显示的，而上一个页面传的是param参数，一刷新就消失了。 如有帮助，麻烦点个[采纳此答案]谢谢^O^
- 2017-06-11 09:29回答 5 已采纳 楼主说的应该是响应式吧。 做响应式站点，建议用bootstrap框架，用 .col-md-num 属性 很轻易就可以实现响应式的了 如果说硬是要自己原生开发的话，那么得把全局元素设置为居中对
- 2022-10-07 17:27回答 2 已采纳 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &l
- 2020-08-01 09:31cumifi2519的博客 by Theran Brigowatz ... Gettin的Griddy With：构建您自己CSS Grid并删除框架 (Gettin’ Griddy With It: build your own CSS Grid and drop the frameworks) Just about every front end developer’s journey ...
- 2018-05-22 21:21我是大头鸟的博客 页面样式乱了，但是又感觉各种js，css都引入了怎么办:一直不太清楚什么原因:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <...
- 2021-10-21 19:05两个蝴蝶飞的博客 假如当用户通过浏览器访问应用服务器，session信息中保存了用户的登录信息，并且session信息没有过期失，效那么用户就一直处于登录状态，可以做一些登录状态的业务操作 但是现在很多的服务器都采用分布式集群的方式...
- 2016-03-24 19:42weixin_33932129的博客 <div class="col-sm-6"> <div class="card card-block"> class="card-title">Special title treatment class="card-text">With supporting text below as a natural lead-in to ...
- 没有解决我的问题, 去提问
