弹性盒子

如下：

justify-content 的使用（弹性子元素在父容器中的位置） 

盒子居中显示

 

 

<style>
     .box{
        display: flex;
            width: 300px;
            background-color:gray;
            justify-content: center;

     }
    
    .box div{
       width: 120px;
            height: 100px;
            margin: 10px;
            background-color: blue;
            text-align: center;
    }
 </style>
 
<body>
    <div class="box">
            <div>盒子1</div>
            <div >盒子2</div>
            <div>盒子3</div>
</div>
</body>

 

posted on 2019-09-16 10:04  惜圆  阅读(141)  评论(0)    收藏  举报

导航