css九宫格3 4 |css中缩放的中心点怎么设置

.container {
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
}
.row {
width: 100%;
display: flex;
}
.col-4 {
flex: 1;
height: 100px;
margin: 5px;
background-color: #ccc;
}

上述代码中，大家首先创建了一个容器，将它的宽度和高度都设置为100%，并将display属性设置为flex，让其成为一个弹性盒子。接着，在每一行内创建三个相同的子元素，宽度分别设置为33.33%，也就是可以让三个元素在一行内均分宽度。最后，将每个子元素的高度和边距都设置一下，并简单的设置了一下背景颜色。

这里的关键点在于设置了flex属性，并使用了flex-wrap属性来控制元素在水平方向的折行情况，通过这些CSS属性的配置，大家就可以在不借助JavaScript等语言的情况下，轻松地实现这种九宫格布局。