css選擇器是什么?
要使用css對HTML頁面中的元素實現一對一,一對多或者多對一的控制,這就需要用到CSS選擇器。
HTML頁面中的元素就是通過CSS選擇器進行控制的。
CSS選擇器:就是指定CSS要作用的標簽,那個標簽的名稱就是選擇器。意為:選擇哪個容器。
CSS的選擇器分為兩大類:基本選擇題和擴展選擇器。
基本選擇器:
1.標簽選擇器:針對一類標簽
2.ID選擇器:針對某一個特定的標簽使用
3.類選擇器:針對你想要的所有標簽使用
4.通用選擇器(通配符):針對所有的標簽都適用(不建議使用)
1.標簽選擇器:一個完整的HTML頁面是有很多不同的標簽組成,而標簽選擇器,則是決定哪些標簽采用相應的CSS樣式,(在大環境中你可能出於不同的位置,但是不管怎么樣,你總是穿着同一套衣服,這件衣服就是由標簽選擇器事先給你限定好的,不管走到哪里都是這身衣服)
如下所示:
style type="text/css">
p{
font-size:40px;
}</style>
<body>
<p>標簽選擇器</p>
</body>
2.id選擇器:根據元素ID來選擇元素,具有唯一性。前面以”#”號來標志。
<head>
<title>Document</title>
<style type="text/css">
#good
{
border:3px dashed green;
}
</style>
</head>
<body>
<h2 id="good">id選擇器</h2>
</body>
3.類別選擇器:類選擇器根據類名來選擇。和id非常相似,任何的標簽都可以攜帶id屬性和class屬性。但是id屬性只能被某一特定標簽引用一次。
如下所示:
<style type="text/css">
.xl{
color: green;
}
.xd{
font-size: 40px;
}
</style>
<p class="xl xd">段落</p>
<p class="xl">段落</p>
<p class="xd">段落</p>
4.通配符*:匹配所有標簽不建議使用。
<style type="text/css">
/*定義通用選擇器*,希望所有標簽的顏色是綠色字符大小40磅*/{
color: green;
font-size: 40px;
}
</style>