CSS指定背景圖位置

在網頁設計中，背景圖的顯示效果很重要。通常情況下，我們會使用 CSS 來指定背景圖的位置，以達到更好的顯示效果。

在 CSS 中，我們可以使用 background-position 屬性來指定背景圖的位置。這個屬性接受兩個值：橫向位置和縱向位置，中間用空格分隔。

background-position: 橫向位置 縱向位置;

同時，我們還可以使用關鍵詞來指定背景圖的位置，如下：

background-position: left top;    /* 左上角 */
background-position: center top;  /* 中上部 */
background-position: right top;   /* 右上角 */
background-position: left center; /* 左中部 */
background-position: center center; /* 居中 */
background-position: right center; /* 右中部 */
background-position: left bottom; /* 左下角 */
background-position: center bottom; /* 中下部 */
background-position: right bottom; /* 右下角 */

下面是一個簡單的例子：

div {
background-image: url(bg.jpg);
background-position: center center;
background-repeat: no-repeat;
}

在這個例子中，我們把一個背景圖作為某個 div 的背景，并把這個背景圖放在了 div 的中央。由于我們設置了背景圖不重復，所以整張背景圖會被放在中央。

總之，在使用背景圖時，我們應該盡可能地讓其效果更美觀，更符合用戶的需求。通過使用 background-position 屬性，我們可以很方便地指定背景圖的位置從而實現更好的顯示效果。