flex布局兼容
来源:互联网 发布:js小于或等于 编辑:程序博客网 时间:2024/05/23 12:44
why?
大家可能想问了,flex
布局为什么会存在兼容性问题啊?
之所以存在兼容性问题,是因为技术在不断的更新,有些旧的浏览器只支持旧语法的书写方式,所以就出现所谓的兼容性问题。
what?
那么新旧版本是什么?
flex布局分为旧版本dispaly: box;
,过渡版本dispaly: flex box;
,以及现在的标准版本display: flex;
。所以如果你只是写新版本的语法形式,是肯定存在兼容性问题的。
- Android
- 2.3 开始就支持旧版本
display:-webkit-box;
- 4.4 开始支持标准版本
display: flex;
- 2.3 开始就支持旧版本
- IOS
- 6.1 开始支持旧版本
display:-webkit-box;
- 7.1 开始支持标准版本
display: flex;
- 6.1 开始支持旧版本
- PC
ie10开始支持,但是IE10的是-ms
形式的。
下面是各个浏览器的支持情况
how?
所以我们该如何进行兼容性的写法呢?
- 盒子的兼容性写法
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 子元素的兼容性写法
- 1
- 2
- 3
- 4
- 5
- 6
- 7
这种兼容写法不一定起效的。尤其是在底版本安卓系统中。因为什么呢?因为所有都是向下兼容的,所以写法的顺序一定要写好了才起作用。就是把旧语法写在底下,个别不兼容的移动设置才会识别,哪些是旧的语法,你懂的。那些带box的一定要写在最下面即可。
所以上面的兼容写法应该是这样的才对:
阅读全文
0 0
- flex布局兼容处理
- flex布局兼容总结
- flex布局兼容
- Flex布局兼容知识点总结
- 【web】flex布局浏览器兼容处理
- 移动端Flex 布局新旧混合兼容
- Flex布局新旧混合写法详解(兼容微信)
- Flex布局新旧混合写法详解(兼容微信)
- Flex布局新旧混合写法详解(兼容微…
- Flex布局新旧混合写法详解(兼容微信)
- Flex布局新旧混合写法详解(兼容微信)
- 移动Web开发基础-flex弹性布局(兼容写法)
- flex兼容
- 刨坑:Flex布局新旧混合写法兼容写法详解(兼容微信)
- Flex布局
- flex布局
- Flex 布局
- flex布局
- Dubbo API 笔记——Dubbo协议&最佳实践
- gulp.order <gulp插件>
- TP5 错误集合
- Xlistview请求网络实现上下拉
- Android自定义控件10----继承View实现水波纹效果
- flex布局兼容
- QT程序的发布步骤及问题的解决(windeployqt 及NSIS)
- (实战项目一)手机App抓包爬虫
- CTF 与 渗透测试学习指南
- my.cnf配置优化
- 漫谈单点登录
- “小明,滚出去!”之程序员版
- 【重磅】新智元推出百万级AI智库资讯互动平台,AI World2017世界人工智能大会TOP10大奖榜单发布
- BeautifulSoup 用法总结