背景定位和背景固定

background-position

    body{
              background-image:url('bgimage.gif');
              background-repeat:no-repeat;
              background-attachment:fixed;
              background-position:center;
  }

定位方法:

1.top left

2.top center

3.top right

4.center left

5. center right

6.center center

7.bottom center

8.bottom left

9.bottom right

  • 如果你只定義了一個(gè)關(guān)鍵詞,那么第二個(gè)值將是center.
  • 默認(rèn)值為:0% 0%
  • 常用負(fù)值來定位。

background-attachment

    body{
            background-image:url('bgimage.gif');
            background-repeat:no-repeat;
            background-attachment:fixed;
            background-position:center;
      }
  • scroll 默認(rèn)值。 背景圖像會(huì)隨著頁面其余部分的滾動(dòng)而滾動(dòng)。
  • fixed 當(dāng)頁面的其余部分滾動(dòng)時(shí),背景圖象不會(huì)移動(dòng)。
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • background-position top lefttop centertop rightcenter lef...
    優(yōu)秀的人A閱讀 214評(píng)論 0 0
  • 一、CSS入門 1、css選擇器 選擇器的作用是“用于確定(選定)要進(jìn)行樣式設(shè)定的標(biāo)簽(元素)”。 有若干種形式的...
    寵辱不驚丶?xì)q月靜好閱讀 1,617評(píng)論 0 6
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,792評(píng)論 1 92
  • CSS 規(guī)則 css 語法:選擇器 、一條或者多條聲明(css屬性) CSS引入方式 1. 行內(nèi)式 通過sty...
    青青玉立閱讀 597評(píng)論 0 0
  • 今天早上遇到了一個(gè)人,我想過無數(shù)次的遇到會(huì)是怎么樣子,心里預(yù)演了很多次,只是沒有想到會(huì)是這個(gè)樣子! 一直以來,我把...
    李蘇珊閱讀 268評(píng)論 0 0