
<h1 class="specailtext">This is a heading with the <span >same class</span> as the second paragraph</h>
<p>This tag has no class.</p>
<p class="specialtext">When a tag has a class attribute, we can target it <span>regardless</span> of its position in the hierachy.</p>
如果希望selector影響的範圍更局限在某一條件下, 可以將標籤名稱再結合class名稱(tag+class), 例如:
p.specialtext {color: red;}
則只有第三段的文字變成紅色。
若再加入另一個selector則可指定得更細 (tag+class+tag), 例如:
p.specialtext span {font-style: italic;}
則第三段內span標籤內的字還會變成斜體。
ID的使用放式與Class類似,只是它是以#來表示,例如:
#uniquetext {font-weight: bold;}
<p id="uniquetext">This is the special text</p>
Class與ID的差異
Class可以重複出現很多次,而一個特定的ID則只能在一個頁出現一次。
Class好比西洋棋中的士兵,而ID就像皇后。
Class與Id雖然好用,但小心不要用度使用,否則會落到如同Font tag般的下場。
1 comment:
another comments test....
Post a Comment