前端技术—9.flex布局

01. flex的介绍

• 了解flex布局、它与传统布局的区别及应用场景
• 对比:
  • 传统布局：
    • 兼容性好、布局繁琐、浮动（清除浮动）
    • 有局限性不能在移动端很好的布局
  • flex布局：
    • 操作方便，布局极其简单，移动端使用比较广泛
    • PC端浏览器支持情况比较差
• 使用：
  • 如果是PC端页面布局，采用传统方式；如果是移动端或者是不考虑兼容的PC端则采用flex布局；
• 特点：
  • 任何一个标签都可以指定使用 flex 布局。
  • 当为父标签设为 flex 布局以后，子元素的 float、clear 和 vertical-align 属性将失效。
  • 使用思想上和传统盒子完全不同，不要再想子元素是块级元素、行内元素，
  • flex通过行和列的思路来控制布局；
• 名称：
  • 采用 flex 布局的元素，称为 flex 容器（flexcontainer），父级简称"容器"。
  • 它的所有子元素自动成为容器成员，称为 flex 项目（flexitem），简称"项目"。
• 语法：flex布局入口，加在容器上

  display:flex;