css四種基本選擇器


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>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM