网格项可以跨越到隐式网格中的最后一行/列吗？
在 CSS 网格中，可以使网格项跨越到使用负整数的显式网格中的最后一行/列。但是，此技术不适用于隐式网格。
隐式网格
隐式网格没有固定数量的行和列，因此不可能直接指定到最后一行/列的跨度。例如，考虑以下具有未知行数的网格：
.container {
display: grid;
grid-template-columns: repeat(3, minmax(10rem, 1fr)) [last-col] 35%;
grid-template-rows: auto [last-line];
}隐式网格中的跨越
要使项目跨越从第一个到最后一个隐式网格中的行，可以使用绝对定位。在此示例中，我们将第三个框放置在其他框上方，然后向下偏移，使其看起来跨越行：
.box:nth-child(3) {
background-color: yellow;
position: relative;
top: calc(-100vh + 20px);
grid-column: last-col / span 1;
grid-row: 1 / last-line;
}显式网格
在明确定义行和列的显式网格中，您可以使用负整数跨越到最后一行/列。如下图所示：
.container {
display: grid;
grid-template-columns: 100px 1fr 100px;
grid-template-rows: 100px 1fr 100px;
}
.item {
grid-column: 2 / -2;
grid-row: 2 / -2;
}在此示例中，.item 元素将跨越网格的整个第二列和行。
结论
虽然 CSS 网格没有提供直接跨越到隐式网格中最后一行/列的方法，但您可以使用绝对值来实现这一点定位。然而，在显式网格中，您可以使用负整数来达到此目的。
以上是如何使网格项跨越到 CSS 网格中的最后一行/列？的详细内容。更多信息请关注PHP中文网其他相关文章！
