Grid 宫格常用布局的实现

两边无缝隙,每列之间有缝隙 width: 100%; display: grid; grid-template-columns: repeat(4,1fr); justify-items: stretch; grid-gap: 1px; 属性介绍:justify-items属性设置单元格内容的水平位置(左中右),align-items属性设置单元格内容的垂直位置(上中下)。 start:对齐单元格的起始边缘。 end:对齐单元格的结束边缘。 center:单元格内部居中。 stretch:拉伸,占满单元格的整个宽度(默认值)。 属性介绍:容器指定了网格布局以后