• 技术文章 >Web开发 >css教程

    css中justify-content属性是什么

    小妮浅浅小妮浅浅2021-10-22 10:02:42原创8674

    1、justify-content属性决定了水平方向子项的对齐和分布方式。

    2、应用在弹性容器上,把弹性项沿着弹性容器的主轴线(main axis)对齐。该操作发生在弹性长度以及自动边距被确定后。

    实例

    .box{
    display:-webkit-flex;
    display:flex;
    width:400px;height:100px;margin:0;padding:0;border-radius:5px;list-style:none;background-color:#eee;}
    .box li{margin:5px;padding:10px;border-radius:5px;background:#aaa;text-align:center;}
    #box{
    -webkit-justify-content:flex-start;
    justify-content:flex-start;
    }
    #box2{
    -webkit-justify-content:flex-end;
    justify-content:flex-end;
    }
    #box3{
    -webkit-justify-content:center;
    justify-content:center;
    }
    #box4{
    -webkit-justify-content:space-between;
    justify-content:space-between;
    }
    #box5{
    -webkit-justify-content:space-around;
    justify-content:space-around;
    }

    以上就是css中justify-content属性的介绍,希望对大家有所帮助。更多css学习指路:css教程

    本文教程操作环境:windows7系统、css3版,DELL G3电脑。

    专题推荐:css justify-content
    上一篇:css中align-items属性是什么 下一篇:css中flex-flow属性是什么

    相关文章推荐

    • css旋转属性如何理解• css设置文字居中的两种方法• css中删除input输入框的阴影• css中margin是什么?怎么设置?• css3中设置元素宽度的方法

    全部评论我要评论

    © 2021 Python学习网 苏ICP备2021003149号-1

  • 取消发布评论
  • 

    Python学习网