打開前端開發工具，新建一個html代碼頁面

在html代碼頁面上創建一個用于設置背景顏色的div標簽，然后給這個標簽添加上class="bg-img"

設置背景圖片。創建style標簽，然后在標簽里面對類為bg-img設置背景圖片、圖片不重復、寬、高的樣式。

保存html代碼，使用瀏覽器打開，這個時候會發現瀏覽器上的背景圖片顯示在左上角。

回到html代碼頁面，在bg-img類里添加background-position:center的樣式。

保存html代碼后重新刷新瀏覽器，這個時候會發現瀏覽器上的背景圖片已經自動居中了。