---CSS選擇器---

今天將在這裏介紹幾種選擇器,其中有標籤選擇器、類選擇器、id選擇器、並集選擇器、通配符選擇器。
選擇器:一般都會去使用id選擇器。

1.選擇器的基本書寫格式

選擇器的一般格式:
Element(元素/標籤)選擇器
標籤名稱{
css屬性:css屬性值;
}

2.部分代碼

1)標籤選擇器

div{
    font-size:20px;
    color:#00F;
    }

2)class類選擇器

  • 在html標籤中給定class屬性
  • 特點:在同一個html頁面中,對個標籤可以指定同名的class屬性值
  • 格式:
    .class屬性值{
    css屬性:css屬性值;
    }
.c_d1{
          font-size:30px;
          color:#0F0;
 }

3)Id選擇器
其中值得注意的是瀏覽器存在兼容問題:
前端:在標籤中大部分能指定id屬性值 唯一的
後端:http協議
request header:(請求頭)
content-type:text/aplain

  • 在標籤中給定一個id屬性值
  • 特點:在同一個html頁面中,標籤的id屬性值必須唯一,不能重複
    後面javascript:通過id屬性值獲取標籤對象,如果同名,document.getElementByld(“id屬性值”)可能獲取不到標籤對象
  • 格式:
    #id屬性值{
    css樣式屬性:css屬性值;
    }
    #dl2{
               font-size:36px;
               color:#F00;
    }

4)並集選擇器
格式:
selector1,selector2,…,selectorn{
css樣式屬性:css樣式屬性值;
}

_d1,#dl2{
font-size:30px;
background-color:greenyellow;
}

5)交集選擇器(子元素選擇器)
selector1 selector2…

div span{
font-size:26px;
color:grey;
}

6)通配符選擇器:*

.*{
font-size:20px;
color:#CCC;
}

3.注意事項

  • 類選擇器的優先級大於標籤選擇器
  • id選擇器的優先級>class選擇器>標籤選擇器
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章