网格布局又是一个新的玩意,它相比于前两者,非常的强大,我也是个初学者,如果译文有误导的地方,请路过的老师多提意见和指正,如果你想阅读英文原文,扫文末下方的二维码,或者跳转到指定的链接就可以了的
开始...div变成一个网格,我们简单地给它一个网格的显示
.wrapper{
display:grid; /* 声明是网格形式展示*/
}
但是,这还没有做任何事情,因为我们还没有定义我们希望我们的网格如何...列和行
为了使它成为二维的,我们需要定义列和行。我们创建三列和两行。...为了确保正确理解这些值与网格外观之间的关系,请看一下这个例子
.wrapper{
display:grid;
grid-template-columns:200px 50px...100px;
grid-template-rows:100px 30px;
}
尝试掌握代码和布局之间的联系.