CSS學習筆記 選擇器

2021-06-18 23:38:52 字數 870 閱讀 1426

用過css的同志們都知道,選擇器是非常重要的,如果選擇器使用不當,即使你的css寫的再好,但是不知道要用在哪個元素上,這不是英雄無用武之地嗎?

css,用過的都說好!

最基本的選擇器,id選擇器,類選擇器這些大家早已心知肚明的就不在這裡贅述了,有那功夫趕緊研究一下把妹攻略

:link,:visited被稱為鏈結偽類,只能被用在標籤上。:hover,:active,:focus稱為動態偽類,可以用於任何元素。

支援自定義屬性

input[title=te] /*屬性選擇器*/

input[other=wch]

順序:!important的使用者樣式 > !important的作者樣式 > 作者樣式 > 使用者樣式 > 繼承 > 瀏覽器樣式

css特殊性計算規則:

css特殊性分成4個等級;a,b,c,d

a表示 style樣式;

b表示id選擇器的數量;

c表示類、偽類和屬性選擇器的數量;

d表示型別選擇器和偽元素選擇器的數量。

由此計算出來的四位數abcd,值越大,優先順序越高;

例如:style=""  

值為1000

值為0200

div#content{}

值為0101

#conten{}

值為0100

p.comment .dateposted{}  值0021

div p{}

值為0002

如果兩個規則的特殊性相同,那麼定義的規則優先。

wchtest element#id	h3

css選擇器學習筆記

概念 層疊樣式表 同乙個樣式都作用於同乙個元素 設定網頁外觀 注意 如果同乙個樣式同時作用於同乙個元素,最終樣式決定於樣式的優先順序 css選擇器 可以使css樣式與元素進行分離 作用 減少 冗餘 方便後期維護 語法 選擇器 注意 符號都是英文的,符號必須寫 行間樣式 語法 標籤名 style 樣式...

學習筆記 CSS選擇器

1 元素選擇器 1.id選擇器,2.類選擇器,3.標籤選擇器,4.萬用字元選擇器 2 關係選擇器 1.包含關係 e f e的所有f後代 2.子代選擇 e!important 內聯樣式 id 屬性 類 偽類 元素 偽元素 關係 萬用字元 繼承 瀏覽器預設屬性 內聯樣式 特殊性 1000 id 特殊性 ...

CSS學習筆記 選擇器

行內新增 內嵌新增 單獨檔案 link tab 標籤選擇器 h1 p 類別選擇器 class id選擇器 id 選擇器的巢狀,用空格 p span 集體申明,標籤用逗號連線 p,h1 全域性申明,固定寬度 960px 980px 1190px 1210px 流式布局 100 響應式布局 檢測裝置資訊...