效果如下(注意虚线是调试工具在检测元素的时候自动加上的,表示的就是每个网格的轮廓) 现在我们加上justify-content: center;后再看 .container{height:500px;width:500px;display:grid;grid-template-columns:80pxauto80px;grid-template-rows:100pxauto100px;justify-content:center;} 效果如下 可以看到此时auto的网格...
在原始状态下，网格的布局可能如下所示（请注意，虚线是用于调试目的，展示的是每个网格的边界）。引入justify-content: center之后，可以看到网格的宽度不再拉伸，而是所有网格都均匀地居中到grid容器的中心位置。接下来，试用justify-items: center。观察结果，网格的布局保持不变，但每个占据网格空间的元素...
flex布局 justify-content:space-between; 解决最后一排数量不够自动向两端排列问题,附录grid栅格布局完美解决[https://blog.c...