今天我們來討論一下如何使用CSS代碼實現圖片等比例縮小的效果。在網頁設計中，如果圖片大小不適合頁面布局，就需要對其進行縮小處理。而等比例縮小可以保持圖片的寬高比不變，使得圖片看起來更加自然。那么該怎么實現呢？ 首先，我們需要在HTML文檔中插入圖片。這里我們以一張名為“example.jpg”的圖片為例，代碼如下： ```html

下面是一張圖片：

<img src="example.jpg" alt="example">

``` 接下來，我們使用CSS代碼對圖片進行縮小處理。我們可以使用“max-width”屬性將圖片的最大寬度設置為屏幕寬度的百分比，這樣圖片寬度就會根據屏幕大小自動縮小。同時，使用“height: auto”將圖片高度設置為自動調整，保持原始寬高比。代碼如下： ```html

下面是縮小后的圖片：

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

``` 如此一來，我們就成功地實現了圖片等比例縮小的效果。而且，這樣編寫CSS代碼還可以保證圖片在移動端和桌面端都可以自適應顯示，增加了網站的可訪問性和用戶體驗。 以上就是實現圖片等比例縮小的CSS代碼介紹，希望對大家有所幫助。