CSS全屏填充圖片是一種比較常見的設計需求。實現方式主要有兩種，一種是使用background屬性來實現；另一種是使用img標簽。下面將詳細說明這兩種方式的實現方法。

1. 使用background屬性實現全屏填充圖片

使用background屬性實現全屏填充圖片的方法比較簡單，只需設置背景圖片并設置background-size為cover，即可使背景圖片等比例縮放并鋪滿整個屏幕。其代碼如下：

body {
background: url(images/bg.jpg) no-repeat center center fixed;
background-size: cover;
}

其中，背景圖片路徑可根據實際情況進行修改，其他屬性解釋如下：

• background：用于設置背景屬性的復合屬性，包含background-color、background-image、background-repeat、background-attachment和background-position。
• url：用于指定背景圖片的路徑。
• no-repeat：用于設置背景圖片不重復。
• center center：用于設置背景圖片在水平和垂直方向上居中。
• fixed：用于設置背景圖片不隨頁面滾動而變化。
• cover：用于等比例縮放背景圖片并鋪滿整個屏幕。

2. 使用img標簽實現全屏填充圖片

使用img標簽實現全屏填充圖片的方法相對復雜一些，需要通過CSS設置img標簽的寬度和高度為100%，同時設置其父元素的高度為100%。其代碼如下：

html, body {
height: 100%;
}
#bg-img {
position: fixed;
top: 0;
left: 0;
z-index: -1;
width: 100%;
height: 100%;
}

其中，html和body的高度均為100%是為了確保父元素的高度為100%，其他屬性解釋如下：

• position：用于設置元素的定位方式，fixed表示元素固定在屏幕上，不會隨頁面滾動而變化。
• top和left：用于設置元素的位置，此處設置為0表示元素位于屏幕左上角。
• z-index：用于設置元素的層級，此處設置為-1表示元素在最底層。
• width和height：分別用于設置元素的寬度和高度為100%，使其填充整個屏幕。

通過上述代碼，我們就可以實現全屏填充圖片的效果了。