![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
grid
文章平均质量分 50
nagenage123
这个作者很懒,什么都没留下…
展开
-
css 快速入门教程 - Grid 网格布局教程
css 快速入门教程 - Grid 网格布局教程学习 grid 时,需要先了解 grid 的一些重要术语。CSS Grid 网格布局 - 重要属性 属性 描述 设置在网格容器上 display display grid 或者 inline-grid 声明元素为网格容器 行和列 grid-template-columns 设置网格列 grid-template-rows 设置网格行 网格排序 grid-aut原创 2021-06-28 16:51:49 · 176 阅读 · 0 评论 -
CSS Grid 网格布局 - auto-fit 关键字 和 auto-fill 关键字的区别
CSS Grid 网格布局 - auto-fit 关键字 和 auto-fill 关键字 的区别auto-fit 和 auto-fill 都是模式填充,在网格容器宽度大于网格项的最小宽度总和时就会有区别。实例解析:css.css :.wrap{ display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); grid-template-rows: 60px; grid-auto-rows: 60px;原创 2021-06-25 14:25:49 · 1120 阅读 · 0 评论 -
css grid 网格布局 - 网格区域对网格线的影响
网格区域的命名会影响网格线的命名。当给区域命名后,区域2条边会自动得到命名 “-start” 和 “-end”。这意味着一条网格线可能有多个名称。比如以下 :.wrap{ display: grid; grid-template-areas:'header header header' 'sidebar main main' 'footer footer footer';}区域名称相同的,在使用时就像单元格合并,如以上的 main ,其上边行线和左边列线为 main-s原创 2021-06-21 13:34:22 · 350 阅读 · 0 评论