1、元素選擇器
li{}最常用、最基本
2、派生選擇器
li strong
標籤間用空格分隔、定義了li標籤中的strong標籤的樣式,css1中上下文選擇器、css2中派生選擇器
3、id選擇器
#id{} 在現代布局中,id 選擇器常常用於建立派生選擇器。#id div{}
4、class選擇器
.classname{} 可以結合元素選擇器
多類選擇器
class=「classname1 classname2 classname3...」空格來分隔在 ie7 之前的版本中,不同平台的 internet explorer 都不能正確地處理多類選擇器
5、後代選擇器
ul em{}無論em元素巢狀多深,都可以選擇到
6、子元素選擇器
如果不希望選擇任意的後代元素,h1>strong{}選擇h1中的所有子元素strong
7、相鄰兄弟選擇器
選擇緊接在另乙個元素後的元素,而且二者有相同的父元素 h1 + p
8、偽類
a:link /* 未訪問的鏈結 */
a:visited /* 已訪問的鏈結 */
a:hover /* 當有滑鼠懸停在鏈結上 */
a:active/* 被選擇的鏈結 */
input:focus{}//ie 瀏覽器不支援此屬性。若宣告了doctype則ie8及以上可以支援
//為了產生預期的效果,在 css 定義中,a:hover 必須位於 a:link 和 a:visited 之後!!
//為了產生預期的效果,在 css 定義中,a:active 必須位於 a:hover 之後!!
//所有主流瀏覽器都支援 :active 偽類。啟用的意思
9、偽元素
css 各種 選擇器
css 各種 選擇器 通配選擇器。全文匹配,所有使用,預設配置 標籤選擇器。應用於標籤為以下的html標籤 td 多標籤選擇器,也叫群組選擇器。應用於所有html標籤為以下的元素 td,p,div,a 類選擇器。應用於html頁面所有class屬性為ibmclass的標籤元素 ibmclass 精確...
各種選擇器
交集選擇器 p.red 選擇並集選擇器 div,p,span,choose,idname 後代選擇器 div p 選中div下的p標籤 choose p 選中.choose類下的p標籤 子代選擇器 僅限於第一代 choose h3 屬性選擇器 選擇具有某種屬性的標籤 a title 選擇帶title...
css選擇器 CSS選擇器總結
在前不久的專案中,實習小妹妹在乙個全域性的樣式中使用了下面這個css選擇器 content 對應的html結構大致是 實習妹子大致的意思是想要讓content下的子元素div的高度100 但是貌似她沒有真正理解first child的意義,從而導致這個全域性的樣式讓 所有頁面都出現了問題,然後我就只...