Perbedaan antara tag id dan class

Dalam mengedit template baik blogger atau Joomla sering sekali kita menemukan tag id dan class, kedua tag ini merupakan tag standar html, namun kadang pemanfaatan kedua tag ini sangat mengglobal di seluruh template. Kedua tag ini juga sering juga ditemukan dalam template blogger maupun Joomla. Ada baiknya kalau kita perjelas perbedaan dan persamaan antara kedua tag ini.

Persamaan tag ID dan class

Tag id dan class merupakan sebuah tautan atau “hook” kepada tag tertentu. Tag ID dan class ini diperlukan untuk menautkan style dalam CSS kepada source code utama.

Contoh css tag class :

.body {
text-align:center;
min-width:1000px;
}

Maka tag class :

<div class="body"></div>

Contoh css tag id :

#wrapper {
margin:0 auto;
text-align:left;
}

Maka tag id :

<div id="wrapper"></div>

Perbedaan tag ID dan class

a. Tag ID adalah unik setiap elemen hanya mempunyai satu tag id.
b. Tag class tidak unik dan dapat digunakan untuk banyak elemen.
c. Tag ID mempunyai fungsi yang special dalam browser.
d. Tag class tidak punya fungsi special dalam browser

Bila kita search dalam source kode blogger dan Joomla kita akan hanya menemukan beberapa jumlah unik ID untuk masing-masing ID jumlahnya satu, dan akan menemukan banyak tag class diberbagai elemen.

Tag id merupakan hash value dalam URL jadi kalau orang mencari id comment dalam blog atau Joomla di browser maka browser akan mencoba untuk mencari elemen tersebut dengan unik id commentnya dan secara otomatis menunjukkan halaman tersebut menuju elemen tersebut.

Namun demikian element dapat memiliki kedua tag tersebut, misalkan :

<li id="comment-27299" class="item">

Dapat memiliki tag id maupun tag class.

Untuk kode javascript juga kadang memerlukan kedua tag ini untuk memperjelas style CSS untuk kode javascriptnya, sehingga kedua tag ini juga penting untuk javascript.

Ok, mudah-mudahan postingan ini dapat membantu untuk pemanfaatan kedua tag ini dalam platform blogger maupun Joomla.

Bila ingin mendapatkan email seperti ini langsung ke inbox email anda silahkan subcribe pada kotak dibawah atau bila subscribe dengan RSS feed Disini