使用css2.1實現多重背景、多重邊框效果
在單一HTML元素上利用CSS2.1實現擁有3張背景圖片和2張內容圖效果，或是多重邊框的效果。這種漸進式增強的方式適用於所有支援CSS2.1偽元素及其定位屬性的所有瀏覽器。不需要CSS3的支援。
支援的瀏覽器：Firefox 3.5+, Safari 4+, chrome4+, opera10+, IE8+
是如何實現的呢？
從本質上講，我們所建立的偽物件（:before和:after）跟我們在對待HTML元素嵌套關係是相同的。但他們相對於巢狀使用的HTML元素而言具有其獨特的優勢——不具有語義化。
當使用多背景或多重邊框的時候，我們需要將偽元素層的內容利用絕對定位固定在HTML元素內容的後面。
並非真實的內容被偽元素所包含進行定位。這意味著他們能在「父」元素範圍內隨意拉伸的同時而不會影響其內容。這可以任意組合絕對定位的top、right、bottom、left、width和height的值，主要關鍵是他們的組合效能是靈活的。
可以達到什麼效果？
只需要依賴一個HTML元素和相關的圖片就可以創建類似於多背景顏色、多背景圖、背景圖片剪輯、圖片翻轉、使用圖片邊框的可擴展的盒子模型、浮動的虛假列（小志注：後面會提到的三列等高效果）、在盒子模型外的圖片、顯示在外面的多邊框，以及其他流行的效果等。可能需要2張額外的內容圖片在生成的內容中。
在使用CSS2.1的多重背景和使用CSS2.1的多邊框示範頁面中將會展示如何使用CSS2.1偽物件的技術來實現這些流行的效果。
大部分的結構都包含子元素。因此，往往很多時候，你將有可能透過父元素的第一個子元素（設定是最後一個子元素）的偽元素來展示更多的效果。此外，還可以透過:hover對樣式產生一些複雜的互動效果的變化。