CSS的自適應寬度似乎是現(xiàn)代前端開發(fā)中不可或缺的一部分。在此文章中，我們將介紹css自適應寬度時需要寫哪些標簽，并給出一些示例代碼。
1. viewport meta標簽
viewport meta標簽用于指定視口的寬度和縮放比例。如下所示：

html
<meta name="viewport" content="width=device-width, initial-scale=1.0">

這個標簽告訴瀏覽器為設備的屏幕寬度設置一個適當?shù)膶挾龋@樣在不同尺寸的設備上，網(wǎng)站的布局就能夠自適應寬度了。
2. 盒子模型
CSS的盒子模型是CSS布局的基礎。它定義了HTML元素的尺寸、內(nèi)邊距、邊框和外邊距，并可以控制它們的布局方式。

css
.box {
width: 80%;
margin: 0 auto;
padding: 20px;
border: 1px solid #ccc;
}

在上面的代碼中，我們用了width屬性來指定元素的寬度，并用了margin和padding屬性來為元素設置內(nèi)邊距和外邊距。
3. 響應式圖片
當我們在移動設備上瀏覽網(wǎng)頁時，一張大圖可能會導致頁面加載速度變慢。因此，我們需要使用響應式圖片來適應不同尺寸的設備。

css
img {
max-width: 100%;
height: auto;
}

上面的代碼可以保證圖片的寬度不會超過其父容器的寬度，這樣就可以適應不同尺寸的設備了。
總結(jié)一下，以上就是css自適應寬度中需要寫的標簽。我們需要掌握viewport meta標簽、盒子模型和響應式圖片等知識點，才能夠設計一個適應不同設備的網(wǎng)站布局。