Untuk bisa memakai CSS secara maksimum, pastinya harus tahu jenis-jenis selector, berikut cara penggunaanya. Jenis selector semacam ini cuma berlaku untuk External dan Embedded style sheet.
» Selector bebas
Cara pemakaian selector bebas mirip seperti pemakaian tag di HTML, cuma selector memakai nama yang dapat kita atur sendiri sesuai kemauan. Bentuk umunya semacam ini :
<style type=”text/css”> testing{ text-decoration: underline; color:green; } </style>
Untuk bisa memakai style ini, dalam dokumen harus di tulis semacam ini :
<testing>Teks ini berwarna hijau dan bergaris bawah</testing>
» Selector dengan class
CSS memperbolehkan kita untuk menggunakan class, dimana didalam sebuah class kita bisa mengelompokkan elemen-elemen dan menerapkan aturan CSS didalamnya. Bingung dengan penjelasan?. Sama, saya juga. Oke, biar ngga’ sama-sama bingung, langsung liat contoh berikut :
<style type=”text/css”> .toplink { text-align : right; } </style>
Nah, beda dengan selector pertama, dalam dokumen penulisannya menjadi semacam ini:
<h2 class=”toplink”>Class Heading 2 </h2>
Heading 2 (h2) di dalam kode di atas bukan sebuah harga mati, h2 mungkin saja diganti dengan tag-tag lain sesuai kemauan. Bergantung tag mana yang akan di atur untuk memakai style toplink dalam CSS di atas.
» Selector id
Berikut ada namanya selector id. Bila selector dengan class dimulai dengan titik, selector id memakai tanda pagar. Contoh penulisannya semacam ini:
<style type=”text/css”> #title { font-size: 10px; text-transform:uppercase; color: red; } </style>
Penulisannya dalam dokumen tak jauh beda dengan selector class. Cuma tulisan “class” kita ganti dengan “id”. Contoh:
<p id=”title”>Tulisan ini berukuran 10, kapital dan berwarna merah</p>