資訊專欄INFORMATION COLUMN
摘要：編寫靜態(tài)頁面時使用常見的元素樣式等使用語義化的元素樣式新增了很多語義化標(biāo)簽若與元素樣式，這兩個標(biāo)簽都是無語義化的表示十與標(biāo)簽是塊級元素獨占一行默認的寬度為父級元素寬度的默認的高度為作用用于布局元素是內(nèi)聯(lián)元素
一、input標(biāo)簽
1.實現(xiàn)按鈕效果
-與表單相關(guān)的按鈕效果
-
2.
二、基本選擇器
1.選擇器的優(yōu)先級別 通配符選擇器 < 元素選擇器 < 類選擇器/屬性選擇器 < ID選擇器 2.元素選擇器 - 定位當(dāng)前頁面的指定標(biāo)簽名 ID選擇器 - 定位當(dāng)前頁面中指定ID屬性值的標(biāo)簽（只能匹配一個標(biāo)簽，無法重復(fù)使用） 類(class)選擇器 - 定位當(dāng)前頁面中指定class屬性值的標(biāo)簽 通配符選擇器 - 匹配當(dāng)前頁面所有內(nèi)容 屬性選擇器 - [attr] - 匹配含有指定屬性(屬性名為attr)的標(biāo)簽(元素)。 3.優(yōu)先級別：內(nèi)聯(lián)樣式 > 外聯(lián)樣式。 4.!important 設(shè)置當(dāng)前內(nèi)容的選擇器的級別為最高; 注意 - 打亂CSS選擇器的默認優(yōu)先級別順序; 建議 - 盡量不要使用.
三、關(guān)系選擇器
1.祖先與后代的關(guān)系 - 后代選擇器 A B 2.父級與子級的關(guān)系 - 子選擇器 A>B 3.相鄰兄弟選擇器 - 定位指定元素的下一個兄弟元素 A+B 4.后面兄弟選擇器 - 定位指定元素的后面所有兄弟元素 A~B
四、組合選擇器
1.組合選擇器 - 選擇器之間使用逗號隔開，之間為并集如：
h1, h2, h3 {font-size: 18px;}
其中：標(biāo)題一
標(biāo)題二
標(biāo)題三
2.組合選擇器 - 選擇器之間沒有任何分隔，之間為交集
1） p#p1 { color: lightcoral; } 都選中
這是一個段落內(nèi)容.
這是一個段落內(nèi)容.
2） p.mini { font-size: 12px; } 只選中p元素。
標(biāo)題二
這是一個段落內(nèi)容.
五、顏色值
1.使用英文單詞描述顏色
-常用的顏色使用比較方便
-問題
-比較特殊的顏色，表示比較麻煩
-不同瀏覽器對單詞描述的顏色存在色差
-建議 - 開發(fā)中，盡量不要使用
2.顏色基本由三原色（紅、綠、藍）組成
-rgb(紅, 綠, 藍)
-每個顏色值的范圍 - 0 ~ 255
- #紅綠藍
-每個顏色使用兩位表示
-值的范圍 00 ~ ff
-舉例
-#000000
六、偽類
偽類 - 設(shè)定指定狀態(tài)下的樣式 標(biāo)簽鏈接 - 默認樣式 未被訪問的樣式 - 字體顏色為藍色 鼠標(biāo)懸浮在鏈接元素時 - 鼠標(biāo)樣式變化 當(dāng)鼠標(biāo)點擊鏈接元素時 - 字體顏色為紅色 已被訪問的樣式 - 字體顏色變化 ：hover ：active ：visited ：link ：focus
七、偽元素
：：before ：：after等
八、塊級元素與內(nèi)聯(lián)元素
1.塊級元素
獨占一行（自動換行） - 所有的塊級元素都是垂直排列的
| 九、語義化 所謂的語義化 -每一個指定的HTML元素， 具有明確的指定含義。 HTML編寫靜態(tài)頁面時 1. 使用常見的HTML元素 + CSS樣式 - |
