.box{
width: 80px; height: 80px;
background-color: lightgray;
border-radius: 5px;
margin:20px;
padding:10px;
display: flex;
flex-direction: column;
justify-content: space-around;
flex-wrap: wrap;
align-content: space-around;
box-shadow: 4px 4px 4px rgba(0,0,0,0.5);
}
.dot{
width: 20px; height: 20px;
background-color: palevioletred;
border: 1px solid;
border-radius:10px;
}
在HTML文件中引用了上述CSS,并有如下代码:
<div class="box">
<div class="dot"></div>
<div class="dot"></div>
<div class="dot"></div>
<div class="dot"></div>
</div>
则显示效果为