這是開通blog后的第一篇隨筆，爭取養成勤于記錄的好習慣，進入正文，精通CSS 高級Web標準解決方案（第二版）自認為是一本非常不錯的css教程，借同事的已經讀過幾遍，每一遍都會有新的收獲。

1.子選擇器、相鄰同胞選擇器

　　IE7以及更高版本的IE，FF,Chrome等瀏覽器都支持這兩個選擇器。

　　子選擇器：IE6可以通過后代選擇器進行模仿，例：

　　　　#nav>li{/*li樣式*/}

　　　　IE6:#nav li{/*li樣式*/ } #nav li *{/*重寫樣式*/}

　　相鄰同胞選擇器：

　　　　h2 + p{

　　　　　　/*為h2相鄰的P元素應用樣式。*/

　　　　}

　　在IE7中這兩個選擇器會有bug，如果父元素和子元素之間有HTML注釋，就會出問題。

2.偽類

　　:link和:visited稱為鏈接偽類，只能應用于錨元素。:hover、:active和:focus稱為動態偽類，理論上可以用于任何元素。大多數瀏覽器都支持這個功能。但是，IE6只注意應用于錨鏈接的:active和:hover選擇器，完全忽略:focus。IE7在任何元素上都支持:hover,但是忽略:active和:focus。

3.屬性選擇器

　　包括IE7的現代瀏覽器都支持屬性選擇器。然而，由于IE6不支持屬性選擇器，可以利用這一點對IE6應用于另外的樣式。

　　#header{

　　　　/*For IE6*/

　　}

　　[id="header"]{

　　　　/*For other browser*/　　

　　}

4.字號繼承問題

　　如果將主體的字號的值設置之后，頁面所有的內容應該是會繼承的，但是在IE 和 Netscape在繼承表格中的字號方面有問題。解決辦法：必須指定表格應該繼承字號，或者表格上單獨設置字號。

5.IE6的非標準盒模型

　　在IE6中width屬性不是內容的寬度，而是內容、內邊距以及邊框寬度的總和。（CSS3中的box-sizing屬性可以定義要使用哪種盒模型，但是除了一些非常特殊的場合很少使用這個屬性）

6.z-index屬性只有在設置了絕對定位的元素才會生效。

7.background-position的用法。

　　background-position:left center;

　　background-position:100px 100px;

　　background-position:20% 20%;(這里的20%是指將圖像上距離左上角20%的點定位到父元素上距離左上角20%的位置)

　　最好不要將像素或百分比等單位與關鍵字混合使用。