by johnburn Thu Dec 31, 2009 10:53 pm
CSS rule boleh dibahagikan kepada 2 bahagian, selector dan juga declaration. Dalam contoh dibawah, h1 merupakan selector dan semua yang terkandung di dlm curly bracket ({}) merupakan declaration untuk style yg akan digunakan selector.
h1 {
color: red;
font-size: 12px;
}
Dalam cnth yg ditunjukkan en ongbok, kita dpt perhatikan penggunaan CSS untk mengubah style berdasarkan selector HTML element (tag) dan class.
-----------------------------
a{
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 18px;
text-decoration: none;
color: #FF0000;
}
Berdasarkan kod CSS di atas hanya tag/HTML element <a> (anchor) sahaja yang akan menggunakan style seperti yg telah ditetapkn dalam CSS.
<p><a href="http://google.com" target="_blank" >Google</a></p>
--------------------------------------------
.style1 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 18px;
text-decoration: none;
color: #0000ff;
}
Semua selector class dalam kod CSS hendaklah menggunakan tanda "." sperti yg ditunjukkan dalm contoh kod CSS di atas.
Kod CSS di atas pula dapat digunakan oleh mana-mana tag/HTML element yg menggunakan class style1:
<p><a href="http://google.com" target="_blank" class="style1">Google</a></p>
------------------------------
Selain selector tag/HTML element dan class, satu lagi selector yg boleh digunakan dalam CSS ialah id. Selector id dalam kod CSS menggunakan tanda "#" seperti yg ditunjukkn di bawah:
#content {
margin: 20px auto;
width: 724px;
}
Sepertimana selector class, selector id boleh digunakan untuk mana-mana tag/HTML element, tetapi hendaklah digunakan sekali sahaja (unik). Oleh itu, selector id biasanya digunakan untuk tag <div> (division, atau bahagian) bg memberikan style untuk satu bahagian tertentu dalam HTML:
<div id="content">
⋮ kandungan untuk bahagian content
</div>