详解css3中dispaly的Grid布局与Flex布局

.content-box { display: grid; grid-template-columns: 160px 160px 160px 160px 160px; grid-template-rows: 160px 160px 160px 160px 160px; } /*或*/ .content-box { display: grid; grid-template-columns: 20% 20% 20% 20% 20%; grid-template-rows: 20% 20% 20% 20% 20%; }

上面代码指定了一个五行五列的网格，列宽和行高都是160px

repeat()函数

有时候，重复写同样的值非常麻烦，尤其网格很多时。这时我们可以用repeat()函数，简化重复的值。

repeat()接受两个参数，第一个为重复的次数，第二个为重复的值。

（编辑：ASP站长）

【免责声明】本站内容转载自互联网，其相关言论仅代表作者个人观点绝非权威，不代表本站立场。如您发现内容存在版权问题，请提交相关链接至邮箱：bqsm@foxmail.com，我们将及时予以处理。