Html
    Css
    Js

    
                        
.wrapper {
	display:grid;
	grid-gap:10px;
	grid-template-columns:100px 100px 100px;
	grid-template-rows:100px 100px 100px;
}
.wrapper div {
	background:#999;
}
.item1 {
	grid-column:1/3;
}
.item3 {
	grid-row:2/4;
}
.item4 {
	grid-column:2/4;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

简单grid布局

九宫格有4*4条线组成,因此子元素的值为1~4

1
      .0
      2018/12/12 17:09:23
      这种布局移动端的兼容性怎么样 回复