zoukankan      html  css  js  c++  java
  • 再次搞懂弹性盒模型

    父级{

    1.  display: -webkit-flex;  声明弹性盒模型

    2. flex-flow 复合写法  ( flex-flow:row wrap;)

            2.  flex-direction;决定子集标签的排列方向  row 从左到右,row-reverse 从右到左, column 垂直方向,column-reverse 垂直从下到上

            3.  flex-wrap:; 是否换行默认不换行   wrap换行 wrap-reverse 换行从底开始



    3.   justify-content ;对齐方式    flex-start 左边对齐 | flex-end 尾巴对齐 | center 居中对齐 | space-between 两端对齐 中间平分| space-around 每个两边都相等;

    }

    4.  align-items  垂直方向的对齐方式; flex-start顶部对齐  flex-end 终点对齐    center 居中 

     子集{

     flex: 4; 可以直接写占用的分数 也可以写  width:500px  这样固定宽度,其他的就是自动自适应布局

    }

  • 相关阅读:
    表单控件和属性
    html5语义化标签
    移动布局
    webpack
    OMobile
    Npm的下载 安装 管理工具
    模块化开发
    百度地图
    离线缓存
    canvas和svg
  • 原文地址:https://www.cnblogs.com/nice2018/p/9660960.html
Copyright © 2011-2022 走看看