zoukankan      html  css  js  c++  java
  • css3代码整理—弹性盒子篇

    父级使用弹性盒子:

    #fu{
    display:flex;
    }

    父级中子级的对齐方式:

    1.水平对齐方式:两端对齐

    #fu
      {
    display:flex;
    justify-content:space-between;
    }

    2.水平对齐方式:作为个体,等分几份,在同一行内居中对齐

    #fu
      { 
    display:flex; 
    
    justify-content:space-around;
    }

    3.水平对齐方式:作为整体,同一行内居中对齐

    #fu
      { 
    display:flex; 
    
    justify-content:center;
    }

    4.水平对齐方式:作为整体,同一行内对齐至开始端

    #fu{
                     display: flex;
                     justify-content: flex-start;
                 }

    5.水平对齐方式:作为整体,同一行内对齐至结束端

    #fu{
                     display: flex;
                     justify-content: flex-end;
                 }

    6.垂直对齐方式:作为整体,同一列内垂直居中

    #wai{
                     display: flex;
                     align-items: center;
                 }

    6.垂直对齐方式:作为整体,同一列内垂直居上

    #wai{
                     display: flex;
                     align-items: auto;
                 }

    6.换行方式:自动换行

    #wai{
                     display: flex;
                     flex-wrap: wrap;
                 }
  • 相关阅读:
    关于 js 下载PDF文件时
    vue3.0 学习
    iOS
    bootstrap treeview
    SVN版本管理
    js框架
    正则表达式
    如何让安卓手机在电脑上同步显示(MX4 Pro为例)
    mysql 中文乱码
    ADO.NET 数据库连接池大小
  • 原文地址:https://www.cnblogs.com/0328dongbin/p/8710057.html
Copyright © 2011-2022 走看看