问题:

IOS8.2 dispaly:flex;不生效;

注意一下兼容写法的顺序问题,


 display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */

 display: -moz-box; /* Firefox 17- */

 display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */

 display: -moz-flex; /* Firefox 18+ */

 display: -ms-flexbox; /* IE 10 */

 display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */

dispaly: -webkit-box与 display: flex一类flex属性值是不同版本的flexbox,

前者是09版本,后者是12版本,如果将-webkit-box写在webkit-flex后面 浏

览器就会调用就版本的flexbox规范

IOS8 对flex兼容性问题的更多相关文章

  1. flex布局在ios8上的兼容性问题

    最近在做项目时,使用到了flex布局.其他ios版本都还好,唯独在ios8上遇到了flex布局没起作用的问题.后来经过研究才发现,safari使用的是webkit内核,在ios8上需要单独加一下兼容才 ...

  2. css flex兼容性

    我测试了一下css flex的兼容性 已经可以兼容到IE10了呀 为啥MDN上面的IE兼容性还是兼容到IE11 有点更新不及时的感觉

  3. flex 兼容性写法

    flex http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html 阮一峰老师详解 box 用于父元素的样式: display: box; 该属 ...

  4. flex兼容性问题

    flex在众多手机浏览器上的兼容方案(亲测华为手机自带浏览器) 如果项目使用构建工具,可加autoprefixer来处理,[autoprefixer使用指南] 纯手写css兼容代码,需给每个使用的属性 ...

  5. flex兼容性之Webpack3+postcss+sass+css

    1:⚠️⚠️ 首先安装依赖 npm install --save-dev webpack style-loader css-loader postcss-loader sass-loader auto ...

  6. 页面常见布局以及实现方法--flex

    页面布局是前端工程师的基本功之一,总结分析各种布局实现方法,可以让自己快速定位哪种方法实现功能,同时可以做到现最大程度的兼容. 一.水平居中 假设:最基本机构 .parent>.child 1. ...

  7. 用Flex实现常见的几种布局

    用Flex实现常见的几种布局 1.水平,垂直居中. <style type="text/css"> .container{ display: flex; width: ...

  8. 87.CSS Flex 弹性盒模型布局教程(共用的css在48篇文章gird)

    CSS Flex 弹性盒模型布局教程 Flex 是 Flexible Box 的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性. flex布局就是给任何一个容器添加 dis ...

  9. 几种常见布局的flex写法

    flex布局目前基本上兼容主流的浏览器,且实现方式简单.我整理了flex的一些知识点,并且总结归纳了几种常见布局的flex写法 ​flex基础知识点 flex-grow和flex-shrink相关计算 ...

随机推荐

  1. solr综合案例

    1.  综合案例 1.1. 需求 使用Solr实现电商网站中商品信息搜索功能,可以根据关键字.分类.价格搜索商品信息,也可以根据价格进行排序,并且实现分页功能. 界面如下: 1.2分析 开发人员需要的 ...

  2. Python+selenium+unittest实现网址登陆及页面跳转校验

    这个网址登陆的单元测试代码都写在一个文件中,方便初学者查看和调试:实际测试工作中根据情况进行模块化处理. 话不多说,分布上代码 一.import必要模块 二.创建测试类,初始化测试环境 三.定义登陆方 ...

  3. 朴素贝叶斯分类器Naive Bayes

    优点Naive Bayes classifiers tend to perform especially well in one of the following situations: When t ...

  4. 使用Ajax新闻系统管理需求分析

      新闻系统管理需求分析 1.1项目背景 新闻发布系统(News Release System or Content Management System),是一个基于新闻和内容管理的全站管理系统,本系 ...

  5. 独立看第一个C++程序到最终结果log----2019-04-16

    (如果一个人夸你,千万别相信,一个人真优秀是不需要说出来的,所以别人夸你的时候也是自己最松懈的时候,千万不能飘,只能说明自己不是很差而已,世界上优秀的人很多,一直优秀到最后的人却是凤毛菱角. 如果一个 ...

  6. docker 搭建LNMP网站平台

    准备好镜像 1.创建网络 docker network create lnmp 测试环境需删除全部之前起的容器 docker rm -f $(docker ps -a |awk '{print $1} ...

  7. Python+Appium自动化测试(11)-location与size获取元素坐标

    appium做app自动化测试过程中,有时需要获取控件元素的坐标进行滑动操作.appium中提供了location方法获取控件元素左上角的坐标,再通过size方法获取控件元素的宽高,就可以得到控件元素 ...

  8. 【linux-centos】安装ifstat!

    1.卸载原装ifstat find / -name *ifstat* 把/usr/sbin/ifstat.ifstat的man目录的.gz文件删除 2.下载安装 wget http://gael.ro ...

  9. jenkins 构建 job 并获取其状态的实现

    目录 BACKGROUND INVESTIGATION I 1. 连续触发的相同 job 构建不会重复入队 2. 连续触发的不同 job 构建会各自入队 3. 参数变动的相同 job 构建将分别入队 ...

  10. pytest文档40-pytest.ini配置用例查找规则(面试题)

    前言 面试题:pytest如何执行不是test开头的用例?如执行 xxx_*.py这种文件的用例. pytest.ini 配置文件可以修改用例的匹配规则. pytest命令行参数 cmd打开输入pyt ...