css 選擇器分類總結

css 選擇器分爲以下幾種:

1,html元素選擇器

以html元素標籤名字顯示

body{
bgcolor:green;
}

p{
color: red;
}

2,id 選擇器


id 選擇器可以爲標有特定 id 的 HTML 元素指定特定的樣式。

id 選擇器以 "#" 來定義。在html主題中,id屬性值始終是唯一的

<p id="red">這個段落是紅色。</p>
<p id="green">這個段落是綠色。</p>

#red{
color:red;
}

#green {
color:green;
}

3 ,class類選擇器

class選擇器,以點(.)顯示

<p class="center">
This paragraph will also be center-aligned.
</p>

.center {
text-align: center;
}

4,派生選擇器,(html,id,class屬性,都有派生選擇器)

li strong {
    font-style: italic;
    font-weight: normal;
  }
 
.center strong
{
    font-style: italic;
    font-weight: normal;
  }


5,組合選擇器(同時控制多個元素)

<h1>第一天</h1>
<h1>第二天</h1>
<h1>第三天</h1>
<h1>第四天</h1>


 h1,h2,h3,h4{
 font-size: 20px;
 color: red;
 }


6,僞元素選擇器

<a href="http://www.baidu.com">百度連接</a> 

正常連接的樣式
a:link{
color: red;
}
鼠標放上去的樣式
a:hover{
color: blue;
}
選擇連接時的樣式
a:active{
color: yellow;
}
已經訪問過的樣式
a:visited{
color: green;
}


7,元素選擇器的優先級


id>class>html









發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章