css网格填充100vh，不影响行高

CSS网格填充100vh是一种常见的前端开发技术，用于实现网页布局的自适应效果。具体来说，vh是视口高度的单位，表示相对于视口高度的百分比。

在网页布局中，我们经常需要将内容填充满整个屏幕高度，同时又不影响行高。使用CSS网格布局可以很方便地实现这一效果。

首先，我们需要在CSS中定义一个网格容器，可以使用display: grid来创建一个网格布局。然后，通过设置网格容器的高度为100vh，即可让网格填充满整个视口高度。

接下来，我们可以在网格容器中定义网格项，通过设置网格项的样式来实现具体的布局效果。可以使用grid-template-rows和grid-template-columns来定义网格的行和列，使用grid-row和grid-column来指定网格项所占的行和列。

需要注意的是，为了不影响行高，我们可以使用grid-auto-rows: minmax(0, 1fr)来设置网格项的行高为0，并使用align-items: stretch来拉伸网格项以填充整个行高。

以下是一个示例代码：

.grid-container {
  display: grid;
  height: 100vh;
  grid-template-rows: 1fr;
  grid-template-columns: 1fr;
  align-items: stretch;
  grid-auto-rows: minmax(0, 1fr);
}

.grid-item {
  /* 网格项的样式 */
}

这样，我们就可以将网格填充满整个视口高度，同时不影响行高。

在实际应用中，CSS网格布局可以广泛用于各种网页布局需求，特别适用于响应式设计和移动端开发。例如，可以用于创建全屏的背景图、平铺式的图片展示、自适应的栅格布局等。

对于腾讯云相关产品和产品介绍链接地址，可以参考腾讯云官方文档或者开发者社区，具体推荐的产品和链接地址会根据实际需求和场景而有所不同。