CSS網(wǎng)頁(yè)固定背景的方法

在CSS中，我們可以使用background-attachment屬性來(lái)固定背景，這個(gè)屬性有三個(gè)值：scroll、fixed和local。

scroll：背景圖像會(huì)隨著頁(yè)面的滾動(dòng)而滾動(dòng)，這是默認(rèn)值。

fixed：背景圖像會(huì)固定在頁(yè)面的某個(gè)位置，不會(huì)隨著頁(yè)面的滾動(dòng)而移動(dòng)。

local：背景圖像會(huì)隨著元素內(nèi)容的滾動(dòng)而滾動(dòng)，但是不會(huì)隨著頁(yè)面的滾動(dòng)而移動(dòng)。

如果我們想要固定背景圖像，可以選擇fixed值。

body {
  background-image: url('image.jpg');
  background-attachment: fixed;
}

這樣，背景圖像就會(huì)固定在頁(yè)面的某個(gè)位置，不會(huì)隨著頁(yè)面的滾動(dòng)而移動(dòng)。

需要注意的是，fixed值只在CSS3及更高版本中可用，如果你使用的是舊版本的瀏覽器，可能無(wú)法支持這個(gè)屬性，在編寫(xiě)代碼時(shí)，***好先測(cè)試一下你的代碼在目標(biāo)瀏覽器中的兼容性。

如果你想要讓背景圖像在頁(yè)面的某個(gè)位置重復(fù)顯示，可以使用background-repeat屬性。

body {
  background-image: url('image.jpg');
  background-attachment: fixed;
  background-repeat: no-repeat;
}

這樣，背景圖像就會(huì)固定在頁(yè)面的某個(gè)位置，并且不會(huì)重復(fù)顯示。