CSS是一種用來控制網頁樣式的語言。在網頁中，圖片是不可或缺的一部分。因此，在CSS中如何使用圖片便成為了一個非常重要的問題。
首先，你需要使用標簽將圖片插入到你的HTML文件中。然后，你可以通過CSS的background-image屬性來設置圖片作為背景。
/*樣式表*/
body {
background-image: url("background-image.jpg");
}
/*HTML代碼*/
<body>
<img src="my-image.jpg" alt="My Image">
</body>除了使用background-image屬性，你還可以用CSS的content屬性來為元素添加圖片。這一技巧通常被用來添加一些小圖標。
/*樣式表*/
.icon:before {
content: url("icon.png");
}
/*HTML代碼*/
<div class="icon"></div>在這個例子中，我們為.icon元素的::before偽元素添加了圖片。如果你在樣式表中直接使用content屬性添加圖片，那么代替元素就會消失。
最后，當使用圖片時，你需要考慮像素密度的問題。在高像素密度的設備上，圖片會變得更加清晰。因此，你需要提供不同像素密度下的圖片。
/*樣式表*/
.my-image {
background-image: url("my-image@2x.jpg");
background-size: cover;
}
/*HTML代碼*/
<div class="my-image"></div>在這個例子中，我們提供了一個2x版本的圖片，這樣在高像素密度的設備上圖片會顯示得更加清晰。
因此，使用圖片是CSS樣式中的一個重要問題。通過使用background-image屬性、content屬性以及考慮不同像素密度問題，你可以使你的網頁更加美觀。