不隨頁面滾動而移動。 url
實現這種效果的 CSS規則以下。
body {
background-image:url(images/watermark.png);
background-position:center;
background-color:#fff;
background-repeat:no-repeat;
background-size:contain;
background-attachment:fixed;
}
沒錯,關於背景圖片的規則寫起來有點費勁,由於屬性名太長了。別擔憂,使用簡
寫屬性 background 就能夠在一條聲明裏設置全部值。 spa
簡寫背景屬性
background 屬性能夠用來設定全部背景相關的值。好比,前面那個 background-
attachment 的例子使用簡寫的 background 屬性,能夠寫成這樣一條規則:
body {background:url(images/watermark.png) center #fff no-repeat contain fixed;}
聲明中少寫了哪一個屬性的值(好比沒寫 no-repeat ) ,就會使用相應屬性的默認值
( repeat ) 。
圖片