css中怎么设置盒子自适应

在CSS中，我们可以使用一些技巧来使盒子自适应。这些技巧包括设置宽度、最大宽度或百分比宽度、使用相对单位等。

/* 设置宽度 */
.box {
  width: 300px;
}

/* 最大宽度 */
.box {
  max-width: 100%;
}

/* 百分比宽度 */
.box {
  width: 50%;
}

/* 相对单位 */
.box {
  /* 相对于父元素 */
  width: 50%;
  
  /* 相对于视口 */
  width: 50vw;
} 

设置宽度是一种常见的方法，但是需要注意的是，在不同设备上，盒子的宽度可能不同，因此最好使用百分比宽度或相对单位。

通过设置最大宽度，我们可以让盒子在浏览器窗口缩小时自适应，不至于溢出。同时，也可以使用媒体查询来针对不同的设备设置不同的最大宽度。

使用相对单位，例如百分比或视口宽度（vw），可以让盒子相对于父元素或浏览器视口大小自适应。但是需要注意的是，在一些特定的布局下，使用相对单位可能会引起一些问题，因此需要慎重使用。