css 100vw、100vh出现滚动条怎么解决

CSS中的100vw和100vh分别代表了视口的宽度和高度，单位是视口宽度和高度的100%。如果你发现使用这两个值时出现滚动条，可能是因为你的内容超出了容器的大小。

解决方法：

1. 检查内容：确保你的内容没有超过100vw或100vh的尺寸。
2. 设置overflow：可以通过设置overflow: hidden;来隐藏滚动条，如果你不希望内容被隐藏。
3. 使用calc()：如果你需要内边距或边框，并且希望内容不超出视口，可以使用calc()函数来计算正确的宽度和高度。例如，width: calc(100vw - padding - border);。
4. 使用box-sizing：确保使用box-sizing: border-box;，这样内边距和边框不会导致元素超出设置的宽度和高度。
5. 使用min-width/min-height：如果你希望内容至少有一定的大小，即使在小屏幕上也不会太小，可以设置min-width: 100vw和min-height: 100vh。

示例代码：

.element {
  width: 100vw;
  height: 100vh;
  overflow: hidden; /* 如果不希望出现滚动条 */
  box-sizing: border-box; /* 防止padding和border导致超出 */
  min-width: 100vw; /* 确保至少有一定大小 */
  min-height: 100vh; /* 确保至少有一定大小 */
}

确保在实际应用中根据你的布局和设计选择合适的方法。