CSS中id選擇器和class選擇器
阿新 • • 發佈：2018-12-25
CSS中對html元素的樣式進行控制是通過CSS選擇器來完成的，最常用的兩種選擇器為id選擇器和class選擇器。
id選擇器和class選擇器介紹
id選擇器：用來為標有特定id的html元素指定特定的樣式，html元素以id屬性來設定id選擇器，CSS中id選擇器以"#"來定義。如下例子：
#para1{
text-align:center;
color:red;
}
<body>
<p id="para1">Hello World！</p>
<p>這個段落不受該樣式的影響。</p>
</body>
上例中第一個<p>就會會被指定為para1樣式。
class選擇器：用於描述一組元素的樣式，html元素通過class屬性來設定class選擇器，可以用於多個html元素，一個元素也可以有多個class選擇器。以"."來定義。
.center{
text-align:center;
}
<body>
<h1 class="center">標題居中</h1>
<p class="center">段落居中。</p>
</body>
id選擇器和class選擇器的區別：
id選擇器：由於我們為html元素指定id時，通常要保證id是唯一的(便於js中的getElementById的正常使用)，所以id選擇器一般在一個頁面中只能被單個的html元素引用。並且不能為一個html元素指定多個id選擇器，試想一下，一個html元素怎麼可能有多個id。
class選擇器：class選擇器可以被多個html元素使用，因為元素的class屬性沒有必要保證唯一性。另外一個html元素也可以有多個class屬性值，值之間用","號隔開。如<p class="cls1,cls2"></p>是可以的。