CSS圖片不占用空間 CSS中，我們可以使用背景圖片來裝飾網頁元素，例如按鈕、導航欄等。相比于使用標簽插入圖片，使用背景圖片有一個重要的優勢——它不會占用元素的實際空間。 值得注意的是，前提是元素已經有了一定的寬度和高度。如果沒有設置寬高，即使設置了背景圖片，元素仍然會保持默認的尺寸。 以下是一段使用背景圖片的CSS代碼：

.button {
width: 150px;
height: 50px;
background-image: url(./button_background.jpg);
background-repeat: no-repeat;
background-size: cover;
border: none;
color: white;
font-size: 18px;
text-align: center;
line-height: 50px;
}

在這個例子中，我們為按鈕元素設置了寬度和高度，然后使用background-image屬性設置了背景圖片的路徑。接下來使用background-repeat屬性設置不重復平鋪，使用background-size屬性將圖片完全覆蓋整個元素。 通過這些CSS屬性的設置，我們成功地在按鈕上設置了背景圖片。但是，該圖片并不會影響按鈕元素的實際大小。 這是因為背景圖片永遠不會改變元素的大小，它只會改變元素的呈現方式。同時，這也意味著我們可以添加各種大小的背景圖片而不必擔心它們會破壞網頁布局。 在實際的網頁開發中，使用CSS背景圖片是一種非常常見和受歡迎的方式，因為它既能提供美觀的視覺效果，又能保持網頁布局的穩定性。