四 css選擇器

2021-08-18 14:35:36 字數 461 閱讀 8774

一、css選擇器

1.class類選擇器  .類名{}

乙個網頁中可以給樣式相同的元素設定同樣的class類名稱;

2.id選擇器  #id名{}

乙個網頁中id選擇器的id名是惟一的,不可以使用id選擇器同時給很多相同樣式的元素設定樣式

3.標籤選擇器 標籤名{}

4.關係選擇器:

1)子選擇器

父元素》子元素{} 用於選擇父元素的第一代子元素;

2)後代選擇器    祖輩元素 後代元素{} 用於選擇祖輩元素下所有此類後代元素

5.萬用字元選擇器 *{} 匹配html所有標籤元素,多用於清楚標籤預設樣式

6.偽類選擇器 偽類選擇器很多但是不能相容所有瀏覽器;

常見的a:hover{} 滑鼠移過a標籤顯示的樣式,只有a標籤使用的偽類選擇器相容所有瀏覽器;

注意:如果在列表標籤使用偽類選擇器顯示二級選單,必須是父子關係;

四 CSS選擇器高階

二 選擇器權重 important 前面我們已經掌握了常用css選擇器和css的一些常用屬性,現在我們進一步擴充套件css選擇器的內容包括內容如下 層級選擇器 找到指定html元素內的某個元素 sport li組合選擇器 組合選擇器可以將多個選擇器用逗號分隔開,進而定義將多個選擇器選擇的元素定義為相...

css選擇器 CSS選擇器總結

在前不久的專案中,實習小妹妹在乙個全域性的樣式中使用了下面這個css選擇器 content 對應的html結構大致是 實習妹子大致的意思是想要讓content下的子元素div的高度100 但是貌似她沒有真正理解first child的意義,從而導致這個全域性的樣式讓 所有頁面都出現了問題,然後我就只...

學習筆記(四) CSS選擇器

css指層疊樣式表 cascading style sheets 也稱css樣式表或級聯樣式表,跟html一樣,也是一種標記語言。由於html的侷限性,網頁的內容只是單純的填充,沒有經過合理排布,樣式醜陋,而用css可以解決這個問題,用於美化網頁,包括設定頁面的文字內容 字型 大小 對齊方式等 外形...