CSS中如何在圖片上添加樣式 在網頁設計中，圖片是必不可少的元素之一。那么，如何在圖片上添加樣式呢？下面介紹兩種方法：使用background屬性添加背景圖或者使用img元素。 方法一：使用background屬性添加背景圖 在CSS樣式表中，可以使用background屬性來給元素添加背景圖。那么，如何將背景圖添加到圖片上呢？只需將背景圖的地址寫在background屬性中，然后將圖片的寬高設置為背景圖的寬高即可。具體代碼如下： pre { font-family: '微軟雅黑', sans-serif; background-color: #eee; padding: 10px; } img { width: 500px; height: 500px; background-image: url('picture.jpg'); background-repeat: no-repeat; } 以上代碼中，我們將p標簽的背景色設置為灰色，然后給img標簽添加了背景圖（picture.jpg），并將它的寬高設置為500px。要注意的是，我們需要將背景圖設置為不重復顯示，否則可能會影響圖片的顯示效果。 方法二：使用img元素 除了使用background屬性添加背景圖，我們還可以使用img元素來直接在圖片上添加樣式。具體代碼如下： pre { font-family: '微軟雅黑', sans-serif; background-color: #eee; padding: 10px; } img { border: 1px solid #ccc; box-shadow: 2px 2px 5px #666; margin: 10px; } 以上代碼中，我們給img標簽添加了一些常見的樣式：邊框、陰影和外邊距。該方法比較簡單，但是需要注意的是，添加的樣式可能會對圖片進行裁剪或者拉伸，影響圖片的顯示效果。 總結 無論使用哪種方法，在為圖片添加樣式時，我們都需要注意圖像的顯示效果，不要影響用戶的體驗。同時，我們還需要注意不要過度添加樣式，以免影響頁面的加載速度。