Jsutify-content关于space-between和space-around的使用效果展示-style #main { width: 350px; height: 150px; border: ...

建站技术分享网

建站技术分享网
首页>> css >>Jsutify-content关于space-between和space-around的使用效果展示
<style>
#main {
    width: 350px;
    height: 150px;
    border: 1px solid #c3c3c3;
    display: -webkit-flex; /* Safari */
    -webkit-justify-content: space-around; /* Safari 6.1+ */
    display: flex;
    justify-content: space-between;  /*space-between和space-around*/
}

#main div {
    width: 70px;
    height: 70px;
}
</style>
</head>
<body>

<div id="main">
  <div style="background-color:coral;"></div>
  <div style="background-color:lightblue;"></div>
  <div style="background-color:khaki;"></div>
  <div style="background-color:pink;"></div>
</div>
01.jpg02.jpg

×

感谢您的支持,我们会一直保持!

扫码支持
请土豪扫码随意打赏

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

打赏作者
版权所有,转载注意明处:FEIBA分享博客 » Jsutify-content关于space-between和space-around的使用效果展示

发表评论

路人甲

网友评论(0)