css背景不捲動的實作方法:先新建一個html程式碼頁面;然後在 標籤後面建立一個標籤;接著在這個標籤裡設定<body>標籤的背景圖片;最後設定「background-repeat:no-repeat;」屬性即可。 推薦:《css影片教學》 開啟html開發軟體,新建一個html程式碼頁面。 在html程式碼頁面的標籤裡面輸入多行段落文字,用於後面瀏覽器滾動條滾動的時候查看圖片時候隨滾動條而滾動條。如圖 設定背景圖片樣式。在 標籤後面建立標籤,然後在這個標籤裡設定<body>標籤的背景圖片,以及背景圖片不重複。 '<p>樣式代碼:<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">body{ background-image: url(img/bg.jpg); background-repeat:no-repeat; }</pre><div class="contentsignin">登入後複製</div></div><p><img src="https://img.php.cn/upload/image/101/832/846/1605842667794518.png" title="1605842667794518.png" alt="css 背景不滾動的實作方法"/><p>儲存html程式碼後使用瀏覽器打開,這個時候滾動瀏覽器滾動條發現背景圖片是隨瀏覽器滾動條的滾動而滾動的。 <p><img src="https://img.php.cn/upload/image/943/102/700/1605842672440514.png" title="1605842672440514.png" alt="css 背景不滾動的實作方法"/><p>使用background-attachment: fixed設定背景圖片不隨捲軸而捲動。回到html程式碼頁面,在body樣式中加入上background-attachment: fixed即可。 <p>如圖<p><img src="https://img.php.cn/upload/image/399/323/641/1605842676462091.png" title="1605842676462091.png" alt="css 背景不滾動的實作方法"/><p>儲存html程式碼頁面後刷新瀏覽器,這個時候滾動瀏覽器滾動條發現背景圖片已經固定不隨瀏覽器滾動而滾動了。如圖<p><img src="https://img.php.cn/upload/image/295/192/789/1605842680263144.png" title="1605842680263144.png" alt="css 背景不滾動的實作方法"/>