筆記 10 2 HTML CSS選擇器筆記

2021-07-10 21:16:13 字數 701 閱讀 6305

css選擇器:

指這組樣式所要針對的物件,可以是乙個html標籤,如body,h1,p,div,a等,也可以是定義了特定id或者class屬性的標籤,如:

--- 標籤選擇器:

可以用 div 來選擇

--- 類選擇器:

可以用 .red 來選擇div

--- id選擇器:

可以用 #lay{color:red;}來選擇

--- 後代選擇器:

表示標籤之間有巢狀關係的選擇方式,如:

p標籤內容

如以上**要選擇p標籤,則可以寫成

div p 來表示,可以清晰的表明各標籤之間的關係,可增強**的閱讀性。

注意:每個標籤之間用空格隔開。

--- 並集選擇器:

表示兩個選擇器之間的交集部分的樣式,如:

外層div

內層div

如要選擇內層div,則可以寫成:

div.nei 來表示選擇內層div,外層div不會收到影響。

再如:外層div

內層div

以上選擇內層div,可以寫成:

div#nei 來表示內層div,外層同樣也不會收到影響。

那麼,並集選擇器的寫法就是:前面是乙個標籤選擇器,其後緊貼乙個類選擇器或者是乙個id選擇器,兩者之間不能用空格隔開,必須緊貼著,再者是後面的選擇器不能是標籤選擇器,只能是類選擇器或者id選擇器。

HTML css樣式選擇器

style簡介 這篇介紹style,style有三種方式 1 在head中加style標籤,在標籤中寫css樣式 2 在body的標籤中新增style屬性,在屬性中增加css樣式 3 在link標籤中引入寫好的css樣式表 一 在head中新增style標籤 1 id選擇器 在乙個html頁面中,不...

HTML CSS 學習筆記三 CSS選擇器

div span p.center center center 段落居中 兩個選擇器之間不加空格或符號 選擇器1選擇器2選擇器3 被選中的元素需要同時滿足所有選擇器 選擇器1,選擇器2,選擇器3 只要符合其中乙個選擇器就會被選中 兩個選擇器之間用空格隔開 祖先元素 後代元素 後代元素 直接後代選擇器...

初學HTML CSS常用選擇器

選擇器 瀏覽器通過選擇器為滿足條件的html元素新增css樣式 id選擇器 瀏覽器為 id標籤屬性的屬性值與 id選擇器名相同的標籤元素新增 css樣式 語法中使用的是 對應的id值 類選擇器 瀏覽器為 class標籤屬性的屬性值與 類選擇器名相同的標籤元素新增 css樣式,語法中使用的是 對應的c...