在Web開發中，背景圖是頁面布局中不可缺少的元素之一。而將CSS背景圖設置為百分百顯示，則可使背景圖隨著頁面的縮放而自適應大小，實現完美的響應式設計。下面我們就一起來學習實現CSS背景圖的百分百顯示吧。

/* html樣式設置 */
html {
height: 100%;
}
/* body樣式設置 */
body {
height: 100%;
background-image: url("bg.jpg"); /* 設置背景圖 */
background-position: center center; /* 使背景圖居中顯示 */
background-repeat: no-repeat; /* 設置背景圖不平鋪 */
background-size: cover; /* 使背景圖充滿整個頁面 */
}

以上代碼中，我們通過設置html和body元素的高度為100%來讓背景圖鋪滿整個頁面。同時，使用background-image屬性設置了背景圖的路徑，使用background-position屬性將背景圖居中顯示，并使用background-repeat屬性將其設置為不平鋪。而background-size屬性則是實現背景圖的百分百顯示關鍵，我們使用cover值將背景圖的大小適配到整個body元素的尺寸。

當然，若你的背景圖是帶有固定比例的圖像，又或者想保留一部分邊緣內容的情況下，可考慮將background-size屬性值設置為contain，它能夠使背景圖等比例放大或縮小到合適尺寸，且無需考慮裁剪圖像內容。

/* body樣式設置 */
body {
height: 100%;
background-image: url("bg.jpg"); /* 設置背景圖 */
background-position: center center; /* 使背景圖居中顯示 */
background-repeat: no-repeat; /* 設置背景圖不平鋪 */
background-size: contain; /* 使背景圖比例適應整個頁面 */
}

在實際應用中，我們可根據實際需要選擇不同的background-size屬性值以實現最佳效果。