flex弹性布局

  flex 弹性布局 是种灵活的布局方案;能够实现响应式布局;在移动端使用频繁;

  

  1.css布局的发展

    关于布局,以下为CSS布局的发展路线:

      

      1. table表格布局 样式简单,只能适用简单的界面

      2. position布局,能够实现很多复杂界面,但是仍存在元素垂直居中、响应式布局等问题

      3. float能够实现响应式

      4. flex是CSS3添加的,语法简单,功能强大;很容易解决元素垂直居中、响应式布局问题;

  2.flex弹性布局的兼容性

    flex语法在不断变化,同时浏览器、Android、IOS等支持程度不尽相同,因此开发者要考虑到兼容性问题;

    webkit为内核的书写时要加上前缀 -webkit-;IE低版本不支持,IE10以上支持;

    flex布局分为旧版本dispaly: box;,过渡版本dispaly: flexbox;,以及现在的标准版本display: flex    

     

  3.Flex的使用

    

参考:

[1] flex.css,移动端flex布局神器

[2] Flex布局原理介绍

原文地址:https://www.cnblogs.com/RocketV2/p/8653695.html