CSS 圖像是可以通過樣式表來為 HTML 元素添加背景圖像的技術。在 CSS 中，使用 `background-image` 屬性來指定元素的背景圖像。圖像可以是在本地電腦上的文件，也可以是位于遠程服務器上的文件。在本文中，我們將探討如何使用 CSS 圖像來美化你的網頁。
首先，我們需要在 HTML 中指定要添加背景圖像的元素。例如，我們想在一個 `
` 元素中添加背景圖像，可以這樣寫：
```html```
接下來，在 CSS 樣式表中，我們可以使用 `.container` 類來為這個 `
` 元素添加背景圖像。例如，我們想添加一張名為 `bg.jpg` 的圖片作為背景圖像，可以這樣寫：
```css
.container {
background-image: url(bg.jpg);
}
```
在使用 `url()` 函數時，如果圖片文件不在同一目錄下，需要指定完整的文件路徑或相對路徑。另外，在指定文件路徑時，需要注意文件名的大小寫。
如果我們希望背景圖像平鋪整個元素，可以使用 `background-repeat` 屬性。默認情況下，背景圖像是不進行重復平鋪的。例如，我們想讓背景圖像水平和垂直方向上都平鋪，可以這樣寫：
```css
.container {
background-image: url(bg.jpg);
background-repeat: repeat;
}
```
如果我們只需要在水平方向上平鋪，可以這樣寫：
```css
.container {
background-image: url(bg.jpg);
background-repeat: repeat-x;
}
```
如果我們只需要在垂直方向上平鋪，可以這樣寫：
```css
.container {
background-image: url(bg.jpg);
background-repeat: repeat-y;
}
```
如果我們希望背景圖像不進行重復平鋪，可以使用 `background-repeat: no-repeat;`。
背景圖像的位置可以使用 `background-position` 屬性來調整。默認情況下，背景圖像的位置是從元素左上角開始的，并且是垂直和水平方向都居中的。例如，我們想將背景圖像移到元素的右下角，可以這樣寫：
```css
.container {
background-image: url(bg.jpg);
background-position: bottom right;
}
```
我們還可以使用像素、百分比等單位來指定背景圖像的位置。例如，我們想將背景圖像向下移動 20 像素，可以這樣寫：
```css
.container {
background-image: url(bg.jpg);
background-position: center 20px;
}
```
最后，我們可以使用 `background-size` 屬性來調整背景圖像的大小。默認情況下，背景圖像會按照其原始大小顯示。例如，我們想將背景圖像的寬度設置為元素的寬度的一半，可以這樣寫：
```css
.container {
background-image: url(bg.jpg);
background-size: 50% auto;
}
```
如果我們想同時調整寬度和高度，可以這樣寫：
```css
.container {
background-image: url(bg.jpg);
background-size: 200px 100px;
}
```
以上是關于 CSS 圖像怎么加的介紹，希望對你有幫助。
上一篇css圖像替換是什么意思
下一篇mysql數據庫等保檢測