型別選擇符:單指元素的名字,而沒有大於號和小於號
類選擇符:選擇所有賦有相同類的元素
乙個點號後面跟類名,類選擇符要跟著類名的後面。
可以把加在萬用字元
*的後面來選擇文件中所有賦予該類的元素,
id 選擇符
群組選擇符:多個選擇符用逗號連起來
後代選擇符:多個選擇符用空白連起來
子選擇符:多個選擇符用大於號連起來
首子選擇符:
把:first-child
加在任何選擇符後。
兄弟選擇符:多個選擇符用加號連線起來
屬性存在選擇符:幫你選擇含有某個屬性的元素,用中括號包圍的屬性的名字。
selector[title]
屬性詞彙選擇符:幫你選擇屬性中包含了某個具體詞彙的元素
selector[title = 「word」]
屬性值選擇符:
幫你選擇屬性值中包含了某個具體值的元素
selector[ title =」exact_match_of_entire_value」]
ie6不支援,
ie7支援較好
偽類元素選擇符:
element:first-letter
*.class:first-letter
#id:first-letter
element:first-
line
*.class:first- line
#id:first- line
注意:first-element, first-line
只對終端塊狀元素相搭配,對內聯元素或結構化塊狀元素不起作用。
侷限:ie6
不支援,除非是選擇符鏈中的最後乙個選擇符。
ie7中修正了。
first-letter
與font
,text
屬性搭配很好。瀏覽器不能定位偽類元素,對他們的排列也存為問題,也就是說:
postion
,left
,right
,top
,bottom
偽類元素不起作用。同樣
vertical-align
對偽類的處理也不一致。
瀏覽器也會有一些例外的情況,如他們不能選擇第乙個字母或者選擇不止第乙個字母,例如當或物件放在第乙個字母前,所有主流瀏覽器都不能選擇第乙個字母,比如
opera 9
不會選擇單元格的第乙個字母,
ie6則把列表選項中的第乙個字母和列表標識都一起選擇。最後,偽類元素還會觸發瀏覽器報錯,所有一定要在所有主流瀏覽器中仔細檢查你所使用的偽類元素
當偽類選擇符位於群組選擇符中,
ie6將不能識別他們。必須宣告
doctype
,這樣:first-child
才能在ie
中生效。
偽類選擇符:
a:link , a:visited , a:hover, a:active , a:focus
偽類選擇符只適用於
ie6只支援超連結上的
hover
偽類,ie7
和其他主流瀏覽器支援所有
hover
css2.1
定義兩個額外的偽類:
first-child
,lang
,ie7
支援first-child,
不支援lang
子類選擇符:
html:
class = 「class subclass etc」>
css*.class
*.class.subclass.etc
繼承:模式:繼承
一類內置於
css語言的選擇符,為了應用繼承,你不用做任何事情,當瀏覽器遇到乙個可繼承的元素,自動把後代元素選中,並給他們付上自己的規則。當你為元素附了乙個屬性後,它會覆蓋所有繼承的值(1
)可繼承的屬性:
¡可被所有元素繼承:
visibility, cursor ¡
被內聯元素繼承:
letter-spacing , word-spacing , white-space , line-height , color , font ,font-family , font-size , font –style , font-variant, font-weight , text-decoration , text-transform ,direction ¡
被終端塊狀元素繼承:
text-indent , text-align ¡
被列表元素繼承:
list-style , list-style-type , list-style-position, list-style-image ¡
被**元素繼承:
border-collapse
不可繼承的屬性:
display , margin , border ,padding ,background , height , min-height, max-height, width , min-width, max-width , overflow , position , left, right ,top , bottom, z-index ,float , clear , table-layout, vertical-align, page-break-after , page-break-before, unicode-bidi
侷限:css
提供乙個常量值
inherited ,
可以把它賦給任何屬性,當屬性被附上
inherited
後,該屬性會從他的父親繼承值,這就允許你強制繼承,
ie7及早期的版本都不支援
inherit,
如何為屬性模擬繼承:首先用任何選擇符選中乙個起始元素,然後在選擇符後放乙個空格和乙個萬用字元,
如selecter *
CSS選擇符 屬性選擇符
使用屬性選擇器可以篩選出設定了特定屬性的標籤。例如選取所有設定了title屬性的 img title 這種選擇符的第一部分是標籤名 img 隨後是屬性名,放在方括號裡 title css不限制屬性選擇符只能使用標籤名,也可以使用類。例如 photo title 用於選取類為photo,而且設定了ti...
CSS選擇符 型別選擇符
h1用於選取特定html標籤的選擇符,叫型別選擇符或元素選擇符。這種選擇符的作用特別大。能把樣式應用到網頁中的每個目標標籤上。使用這種選擇符,只需少量工作就能大幅修改網頁的外觀。假如想讓網頁中每個段落都使用相同的字型 顏色和字型大小,只需編寫乙個選擇符為p 表示標籤 的樣式即可。html 最基本的佐...
CSS 選擇符大全(常用css選擇符)
e 某個元素,如p id 使用id,如 idname class 使用class,如.myclass 萬用字元 包含選擇符 e f e所有的f包含子代,孫代,子子孫孫等等 子選擇符 e相鄰選擇符 e f 和e相鄰的f,相隔乙個都不算 兄弟選擇符 e f 和e同級的f的算 e att e中帶有某個at...