CSS背景圖片不滾動是一個很常見的需求，特別是當你有一個全屏幻燈片或網站的頂部需要固定背景圖片時。那么，該如何實現背景圖片不隨頁面滾動而滾動呢？

background-attachment: fixed;

是的，真的這么簡單！只需要在CSS中添加上面這行代碼即可將背景圖片固定不動。這個CSS屬性指定背景圖片的滾動方式。默認值為“scroll”，表示跟隨頁面滾動；而“fixed”表示不隨頁面滾動而滾動。

下面是一個簡單的示例：

html, body {
height: 100%;
margin: 0;
padding: 0;
}
.top-section {
background-image: url("bg.jpg");
background-size: cover;
background-attachment: fixed;
height: 100%;
}

這里，我們將“html”和“body”元素的高度設置為100%，以確保我們的頂部部分占據整個屏幕。然后，我們將背景圖片的大小設置為“cover”，以使其水平和垂直方向都可以精確擬合整個區域。最后，通過“background-attachment: fixed”命令將背景圖片固定在原位。

總體來說，CSS背景圖片不滾動是一個很簡單的技巧，但卻可以為你的網站帶來有趣的效果。在實際使用中，你可以根據自己的需求來嘗試不同的方式來優化你的設計。