css3 宽度为屏幕宽度

CSS3 中有一个特别有用的属性，可以将元素的宽度设置为屏幕宽度，进而实现响应式设计。这个属性就是 width: 100vw;。vw 即 viewport width，表示视口的宽度，可以理解为浏览器可视区域的宽度。

例：
.full-width {
  width: 100vw;
}

使用这个属性，可以在不同尺寸的设备上，在 CSS 上只需要写一套样式，实现全屏效果。比如，使用 100vw 将一个容器元素的宽度设置为屏幕宽度，那么无论窗口有多大、屏幕分辨率有多高，这个容器都会正好铺满整个屏幕。

不过要注意的是，100vw 可能会有一些滚动条的出现，这是因为可能有一些内容出现了溢出情况。此时，可以通过 overflow-x: hidden; 警告让内容不再出现溢出。

例：
.full-width {
  width: 100vw;
  overflow-x: hidden;
}

总之，通过 width: 100vw;，可以轻松地实现响应式设计，带来更好的用户体验和视觉效果。