移动web开发之flex布局
建议:
如果是PC端页面布局,我们还是传统布局
如果是移动端或者不考虑兼容性问题的PC端页面布局,我们还是使用flex弹性布局....flex-wrap:设置子元素是否换行
align-content:设置侧轴上的子元素的排列方式(多行)
align-items:设置侧轴上的子元素的排列方式(单行)
flex-flow:复合属性,相当于同时设置了...做出来的效果:
但是也有主侧轴的问题,假如我设置的主轴是y轴,再让侧轴居中,出来的效果就是:
但是这个属性只适用于单行文本....align-items和align-content的区别
align-items适用于单行情况下,只有上对齐,下对齐,居中和拉伸.
align-content适用于换行(多行)的情况下(单行时无效),可以设置上对齐...flex-start,但是我只想让第三号盒子变成flex-end,这时就该用到align-self了.但是这时我们不能写在父元素里面,要写在要单独设置的元素里面,要给哪个元素单独设置,就写在哪个里面.图为只给第三个盒子设置