CSS可以讓網(wǎng)頁中的圖片和按鈕自適應(yīng)，在不同屏幕尺寸下顯示得更加完美。這對(duì)于響應(yīng)式網(wǎng)頁設(shè)計(jì)非常重要，下面我們來看看如何實(shí)現(xiàn)圖片和按鈕的自適應(yīng)。

/* 圖片自適應(yīng) */
img {
max-width: 100%;
height: auto;
}
/* 按鈕自適應(yīng) */
.btn {
display: block;
width: 100%;
max-width: 200px;
margin: 0 auto;
padding: 10px 20px;
border: none;
border-radius: 5px;
background-color: #007bff;
color: white;
text-align: center;
text-decoration: none;
}

對(duì)于圖片自適應(yīng)，我們使用了max-width屬性，它會(huì)將圖片的寬度限制在父元素的最大寬度內(nèi)，同時(shí)保持原始高度比例不變。這樣即使在較小的屏幕上也不會(huì)使圖片變形。

對(duì)于按鈕自適應(yīng)，我們使用了display: block屬性，它將按鈕設(shè)置成塊級(jí)元素，使其寬度占據(jù)整行。同時(shí)，我們?cè)O(shè)置了max-width屬性和margin: 0 auto屬性，使按鈕在不同屏幕尺寸下始終保持適當(dāng)?shù)拇笮『途又袑?duì)齊。這樣即使在移動(dòng)端屏幕上也可以輕松點(diǎn)擊到按鈕。