CSS background 屬性


定義和用法

background 簡寫屬性在一個聲明中設置所有的背景屬性。

可以設置如下屬性:

  • background-color
  • background-position
  • background-size
  • background-repeat
  • background-origin
  • background-clip
  • background-attachment
  • background-image

如果不設置其中的某個值,也不會出問題,比如 background:#ff0000 url('smiley.gif'); 也是允許的。

通常建議使用這個屬性,而不是分別使用單個屬性,因為這個屬性在較老的瀏覽器中能夠得到更好的支持,而且需要鍵入的字母也更少。

默認值: not specified
繼承性: no
版本: CSS1 + CSS3
JavaScript 語法: object.style.background="white url(paper.gif) repeat-y"

實例

如何在一個聲明中設置所有背景屬性:

body
  { 
  background: #00FF00 url(bgimage.gif) no-repeat fixed top;
  }

親自試一試

瀏覽器支持

所有瀏覽器都支持 background 屬性。

注釋:IE8 以及更早的瀏覽器不支持一個元素多個背景圖像。

注釋:IE7 以及更早的瀏覽器不支持 "inherit"。IE8 需要 !DOCTYPE。IE9 支持 "inherit"。

可能的值

描述 CSS
background-color 規定要使用的背景顏色。 1
background-position 規定背景圖像的位置。 1
background-size 規定背景圖片的尺寸。 3
background-repeat 規定如何重復背景圖像。 1
background-origin 規定背景圖片的定位區域。 3
background-clip 規定背景的繪制區域。 3
background-attachment 規定背景圖像是否固定或者隨着頁面的其余部分滾動。 1
background-image 規定要使用的背景圖像。 1
inherit 規定應該從父元素繼承 background 屬性的設置。 1

親自試一試 - 實例

所有背景屬性在一個聲明之中
本例演示如何使用簡寫屬性來將所有背景屬性設置在一個聲明之中。

相關頁面

CSS 教程:CSS 背景

CSS3 教程:CSS3 背景

HTML DOM 參考手冊:background 屬性

出自:http://www.w3school.com.cn/css/pr_background.asp


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM