阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      聊一聊Flex布局有哪些属性

      Flex布局

      采用Flex布局的元素,称为Flex容器(flex Container),简称"容器"。

      它的所有子元素自动成为容器成员,称为Flex项目(flex item),简称"项目"。

      容器默认存在两根轴:水平的主轴(main axis)和垂直的交叉轴(cross axis)。主轴的开始位置(与边框的交叉点)叫做main start,结束位置叫做main end;交叉轴的开始位置叫做cross start,结束位置叫做cross end。

      项目默认沿主轴排列。单个项目占据的主轴空间叫做main size,占据的交叉轴空间叫做cross size。

      容器的属性

      以下6个属性设置在容器上。

      • flex-direction 属性决定主轴的方向(即项目的排列方向)。
      • flex-wrap 属性定义,如果一条轴线排不下,如何换行。
      • flex-flow flex-flow属性是flex-direction属性和flex-wrap属性的简写形式。
      • justify-content 定义了项目在主轴上的对齐方式。
      • align-items 属性定义项目在交叉轴上如何对齐。
      • align-content align-content属性定义了多根轴线的对齐方式。如果项目只有一根轴线,该属性不起作用。

      更多面试题

      如果你想了解更多的前端面试题,可以查看本站的WEB前端面试题 ,这里基本包涵了市场上的所有前端方面的面试题,也有一些大公司的面试图,可以让你面试更加顺利。

      面试题
      HTMLCSSJavaScript
      jQueryVue.jsReact
      算法HTTPBabel
      BootStrapElectronGulp
      Node.js前端经验相关前端综合
      Webpack微信小程序-

      这些题库还在更新中,如果你有不错的面试题库欢迎分享给我,我整理后放上来;人人为我,我为人人,互帮互助,共同提高,祝大家都拿到心仪的Offer!

      目录
      目录