中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx

背景(background)

包括background-color, background-image, background-repeat, background-attachment, background-position五種屬性.

1. background-color: 指背景顏色, 其屬性值有三種形式, 十六進(jìn)制, 顏色名稱, rgb值. 目前最為常用的是”#+十六進(jìn)制數(shù)”. 例: 本站顯示代碼的段落背景為#EEEEEE的灰色, 代碼及示例如下:

background-color: #EEEEEE;

2. background-image: 指背景圖片, 其屬性值為背景圖片的地址, 代碼和格式如下:

background-image: url(http://jorux.com/back.png);

例: 本站首頁的第一篇文章標(biāo)題前有個(gè)”NEW”圖標(biāo), 查看css可見如下代碼:

#homeheadline a{
color:#444;
padding: 30px 68px 0 40px;
margin:0;
background:url(images/new.png) no-repeat 0 16px ;
}

3. background-repeat: 指背景圖片的重復(fù)與否以及重復(fù)方式, 有no-repeat, repeat, repeat-x, repeat-y四種屬性值.

• no-repeat: 即無論背景圖片的大小, 只顯示單個(gè)背景圖片,  如首頁的第一篇文章標(biāo)題前的”NEW”圖標(biāo), 代碼如上所示;
• repeat: 指背景圖片橫向和縱向重復(fù)連續(xù)顯示;
• repeat-x: 指背景圖片橫向重復(fù)連續(xù)顯示;
• repeat-y 指背景圖片縱向重復(fù)連續(xù)顯示;例: 查看本站css文件,可以看到以下代碼:
  body {
  font: normal 12px/1.5 Georgia, sans-serif;
  text-align:left;
  background:#444 url(images/bodybg.jpg) repeat-y;
  }

可以看到背景圖片bodybg.jpg是縱向重復(fù)顯示的, 并隨頁面的長度的增加而增加.

4. background-attachment: 指背景圖片的附著方式, 有scroll(默認(rèn)屬性)和fixed兩種屬性值. scroll指背景圖片隨頁面的滾動而滾動, 而fixed屬性值則可使背景圖片固定于瀏覽器的某個(gè)位置, 不隨頁面滾動而滾動. 如下例所示, 您可以試著滾動本頁面來看看兩圖的差別, 左邊為scroll, 右邊為fixed(請用IE觀看以下演示):

出處：Jorux Notebook
責(zé)任編輯：moby

上一頁 css基礎(chǔ)教程屬性篇之二 [2] 下一頁 css基礎(chǔ)教程屬性篇之二 [4]

◎進(jìn)入論壇網(wǎng)頁制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評論。