|
新屬性：(background-break)
CSS3 中，元素可以被分成幾個獨立的盒子(例如 使內(nèi)聯(lián)元素 span 跨越多行)。background-break 屬性用來控制背景怎樣在這些不同的盒子中顯示。
可能值為：
- Background-break: continuous;
默認值。忽略盒之間的距離(也就是像元素沒有分成多個盒子，依然是一個整體一樣)
- Background-break: bounding-box;
把盒之間的距離計算在內(nèi)
- Background-break: each-box;
為每個盒子單獨重繪背景
背景色(background-color)的改進
background-color 在 css3 中有了稍許改進。除了設(shè)置背景顏色之外，如果元素底層的背景圖不可用，還可以設(shè)置一個“回退色”。
通過在回退色之前增加一個斜杠(/)來實現(xiàn)，例如：
background-color: green / blue;
此例中，背景色應該是綠色(green)。然而，如果底層背景圖不能使用的話，背景色就是藍色而不是綠色。如果在斜杠前不指定顏色，默認為透明(transparent)。
背景平鋪(background-repeat)的改進
CSS2中當圖片平鋪時，會被元素在末端截斷。CSS3 引入了兩個屬性來修正這個問題:
- space: 應用同等數(shù)量的空白到圖片之間，直到填滿整個元素
- round: 縮小圖片直到正好平鋪滿元素
關(guān)于 background-repeat: space; 的一個例子，可以在 CSS3 規(guī)則網(wǎng)站看到。
背景附著(background-attachment)的改進
background-attachment 屬性增加了一個新值：local。這是用來配合可以滾動的元素的(設(shè)置為 overflow: scroll; 的元素)。當 background-attachment 設(shè)置為滾動(scroll)時，背景圖不會隨元素內(nèi)容的滾動而滾動。
設(shè)置為 background-attachment :local; 時，背景圖會隨內(nèi)容的滾動而滾動。
總結(jié)
總結(jié)一下，css 中關(guān)于背景有許多需要知道的知識。但是一旦把這些知識融會貫通了，這些技術(shù)和命名約定就變得非常有意義而且很快就會成為潛意識行為了。
如果剛接觸 css，主要不斷聯(lián)系就可以較快地掌握背景的要點了。如果是老手，我希望你可以和我一樣期待 css3 。
關(guān)于作者
Michael Martin 的文章大多涉及網(wǎng)頁設(shè)計，WordPress 并為 Pro Blog Design 工作�？梢圆榭锤嚓P(guān)于博客設(shè)計的文章或者在 twitter 上關(guān)注他。
糖伴西紅柿：一看到這么長篇大論的也頭暈，花了好幾天的時間折騰這篇文章。全是基礎(chǔ)的只是，沒有什么花哨的，但是我覺得最基礎(chǔ)的也是最重要的。
鑒于好多網(wǎng)站都會轉(zhuǎn)載別人的文章，當然了，好的文章我們也會轉(zhuǎn)載，不過有些人直接把別人辛辛苦苦的勞動付出拿來當自己的東西。
這些人真的很無恥，這個大環(huán)境也真的很悲哀，沒人愿意踏踏實實地做事。這就是為什么我們總是翻譯國外的文章，而不是把咱們的文章翻譯成外語讓外國人看的根本所在。
可悲啊。
本文鏈接：http://m.95time.cn/tech/web/2009/7001.asp 
出處：前端觀察
責任編輯：bluehearts
上一頁 CSS背景全攻略 [5] 下一頁
◎進入論壇網(wǎng)頁制作、WEB標準化版塊參加討論，我還想發(fā)表評論。
|
第 1 頁 
第 6 頁 CSS背景全攻略 [6]
