zoukankan      html  css  js  c++  java
  • [HTML/CSS]Flex布局中space-evenly的兼容性

    属性介绍

      space-evenly: 均匀排列每个元素,每个元素之间的间隔相等

      space-between: 均匀排列每个元素,首个元素放置于起点末尾元素放置于终点

    思路

      假设我们容器里面有3个元素

      space-evenly: 容器剩余空间由4个间隙平分

      space-between: 容器剩余空间由2个间隙平分

      即,

      如果我们在space-between的情况下添加两个宽度为0的伪类(n-1+2),那么就等于是在用space-evenly布局(n+1)

    container{
          display: flex;
          justify-content: space-between;
           //justify-content: space-evenly;
    }
    container::before,
    container::after{
        content: '';
        display: block;
    }
    

      

  • 相关阅读:
    十天冲刺:第四天
    十天冲刺:第三天
    会议2.3
    会议2.2
    会议2.1
    团队绩效管理
    Alpha版(内部测试版)发布
    意见汇总
    建议汇总
    会议1.10
  • 原文地址:https://www.cnblogs.com/SoYang/p/11204381.html
Copyright © 2011-2022 走看看