您的位置 首页 css教程

css如何实现n宫格布局

设计思路(无关你是scss还是less)

1、为了方便内部元素水平/垂直居中, 整体我们用flex布局.

2、使用正方形占位, 因为用了padding-top:100%, 所以我们就需要再单独用一个div来装内容, 我给他起名"item__content".

3、为了让内容的容器div充满方块, 我们给他设置样式:position:absolute;top:0;left:0;right:0;bottom:0;;

关于作者: admin

热门文章

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

网站地图