CSS 網格可以直接定位孫子嗎？

CSS 格：你能在格子上定位「孫子」嗎？

許多 CSS 網格指南暗示了網格定位元素所在的結構網格元素的直接子元素。但是，當您需要將“孫子”元素直接放置在網格本身上時，可能會發生這種情況。

需要「子網格」

在嵌套場景中對於祖父母網格、父容器和孫子元素，您可能希望將每個孫子元素放置在網格內其行上。這在網格術語中有意義嗎？

輸入：display: subgrid

從 CSS Grid Level 2 草稿規格中，我們引入了 display: subgrid 的概念。套用於網格項目時，display: subgrid 允許項目的子項繼承容器網格的佈局，同時忽略項目的網格屬性。

此功能尚未在瀏覽器中廣泛實現。然而，它為“孫子”定位問題提供了一個潛在的解決方案。

現在的替代方案

在等待顯示支援時：子網格，存在替代方法：

• 在網格項上使用display: grid （儘管有限制存在）。
• 使用 display: 內容垂直繼承網格線。

其他資源

• [什麼是 CSS展示：子網格？ ](https://developer.mozilla.org/en-US/docs/Glossary/display)
• [CSS 網格等級2 中的子網格](https://blogs.igalia.com /mrego /2016/02/12/subgrids-thinking-out-loud/)
• [顯示：用於對齊孫子項目的子網格容器](https://bugzilla.mozilla.org/show_bug.cgi ?id=1240834)

以上是CSS 網格可以直接定位孫子嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！