選擇器
-
ID選擇器: #id {}
-
類選擇器: .class {}
-
屬性選擇器: a[href=“www.baidu.com”] {}
-
僞類選擇器: :hover {}
-
僞元素選擇器: ::after {}
-
標籤選擇器: div {}
-
通配符選擇器: * {}
選擇器的權值
選擇器 | 權值 |
---|---|
內聯Style | 1000 |
ID選擇器 | 100 |
類選擇器 | 10 |
屬性選擇器 | 10 |
僞類選擇器 | 10 |
標籤選擇器 | 1 |
僞元素選擇器 | 1 |
ID選擇器: #id {}
類選擇器: .class {}
屬性選擇器: a[href=“www.baidu.com”] {}
僞類選擇器: :hover {}
僞元素選擇器: ::after {}
標籤選擇器: div {}
通配符選擇器: * {}
選擇器 | 權值 |
---|---|
內聯Style | 1000 |
ID選擇器 | 100 |
類選擇器 | 10 |
屬性選擇器 | 10 |
僞類選擇器 | 10 |
標籤選擇器 | 1 |
僞元素選擇器 | 1 |
<style type=text/css>td { font-size: 12px; color: #000000; line-heig
絕對定位 + margin,讓明確寬高的盒子水平垂直居中於窗口 <!DOCTYPE> <html> <head> <meta charset="UTF-8"> <meta name="vie
二級導航實例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti
3d盒子反戰 效果如圖如下: HTML重要的代碼如下: <ul> <li> <div class="box"> <div class="front">目錄