Apa perbedaan . (titik), # dan ; (titik koma) pada CSS?

| Selasa, 07 Januari 2014
Perbedaan .(titik)# dan ;(titik koma)pada CSS
.(titik) dan # di CSS ini untuk membedakan selector
 a)       SELECTOR CLASS(.)titik
Selector class digunakan untuk menentukan style dari sebuah group elemen,ini dapat digunakan berulangkali  pada elemen-elemen yang ada pada sebuah halaman web.Artinya sebuah nama class dapat dipanggil beberapa kali pada elemen-elemen  yang ada pada sebuah halaman web.Selector class dituliskan dengan ditandai dengan tanda”.”(titik) contohnya:
<html>
<head>
<title>Pemakaian Selector ID dan Selector Class pada CSS</title>
<link href=”css/style.css” type=”text/css” rel=”stylesheet”/>
</head>
<body>
<p>
Pemakaian Selector ID dan Selector Class pada CSS
</p>
<p class=”namaclass”>Pemakain Selector CLASS pada CSS akan memakai Atribut (.)
</p>
</body>
</html>
Setelah menentukan CLASS nya semisal “namaclass” (anda bebas menentukannya) , maka pada file CSS anda menggunakan selector (.) atau titik/dot berikut contohnya :
Pada file CSS :
.namaclass{
font-family:Verdana;
color:#3300FF;
font-size:16px;
font-weight:bold;
}
b)            SELECTOR ID(#)
Selector ID digunakan untuk menentukan style bagian unik dari HTML.unik disini artinya satu nama id hanya bisa digunakan satu kali pada sebuah halaman web.Apabila satu nama ID digunakan lebih dari satu nama ID maka yang akan dipakai adalah ID yang pertama saja,syntax ID pada css ditandai dengan(#).contohnya:
< html >
< head >
< title >Pemakaian Selector ID dan Selector Class pada CSS</title>
< link href=”css/style.css” type=”text/css” rel=”stylesheet”/>
< /head >
< body >
< p >
Pemakaian Selector ID dan Selector Class pada CSS
< /p >
< p id=”namaid”>Pemakain Selector ID pada CSS akan memakai Atribut #
< /p >
< /body >
< /html >
Setelah menentukan ID nya semisal “namaid” ( anda bebas menentukannya ) , maka pada fileCSS anda menggunakan selector # berikut contohnya :
Pada file CSS :
#namaid{
font-family:Verdana;
color:#3300FF;
font-size:16px;
font-weight:bold;
}
c )       GAYA INLINE(;)titik koma
Menuliskan langsung kedalam Tag HTML menggunakan  atribut style,hal yang penting diperhatikan adalah sedapat mungkin Tag HTML yang digunakan berdiri sendiri,sehingga penggunaan gaya inline tidak terlalu sering di gunakan,attribut style yang digunakan dalam gaya inline dapat berisi  property CSS.Dan jika menggunakan deklarasi CSS lebih dari satu maka wajib dipisahkan dengan tanda (;)titik koma,contohnya:
<div style="color: #ff2500; background-color: #001530; margin: 10px; padding: 5px;border: 1px solid #000558;">Ini adalah contoh penggunaan gaya inline.</div>

Kelihatannya hampir sama ya untuk penggunaan selector ID dan Class, mari kita bahas perbedaanya…
Perbedaan antara Selector ID dan Selector Class
Perbedaan antara pengunaan selector ID dan Class adalah:[ad#ad-2]
·         Jika pada selector ID anda tidak bisa menambahkan lebih dari 1(satu)nama ID pada Tag HTML
·         Pada selector Class anda bisa menaruh lebih dari satu atau berapapun yang anda butuhkan.
Jadi kesimpulannya untuk selector ID digunakan untuk pengaturan yang spesifik pada Tag HTML.

0 komentar:

Posting Komentar

Next Prev
▲Top▲