栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

在主容器中放置网格项的内容(子网格功能)

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

在主容器中放置网格项的内容(子网格功能)

display: subgrid

从 CSS Grid Level 2草案规范开始:

2.网格容器

子网格提供了通过嵌套元素向下传递网格参数的功能,并将基于内容的大小调整信息返回到其父网格。

如果该元素是网格项(即,它是流入的并且其父

display:subgrid
元素是网格容器),则将该元素设为子网格(这是网格容器框的一种特殊类型),因此忽略其
grid-template-*
grid-*-gap
属性,而赞成采用父网格跟踪其跨度。

3.子网格

通过赋予网格项目本身,它可以成为网格容器

display: grid
。在这种情况下,其内容的布局将独立于其参与的网格的布局。

在某些情况下,可能有必要使多个网格项目的内容相互对齐。本身是网格项目的网格容器可以通过使用将其行和列的定义推迟到其父网格容器

display:subgrid
,使其成为子网格。

在这种情况下,子网格的网格项将参与父网格容器的网格大小调整,从而使两个网格的内容对齐。阅读更多。

主流浏览器尚未实现此功能。谁知道什么时候会。

在Grid中,只有容器的流入子级才成为网格项,并且可以接受网格属性。

对于

display: subgrid
网格项目,该项目的子项尊重容器的线条。

根据Grid Level 1规范,

display:subgrid
已推迟到Level 2。

目前,

display: grid
在某些情况下,在网格项目(即嵌套的网格容器)上可能会有用。

另一个可能的解决方法是

display: contents



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/442407.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号