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.
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.
wohoho...
BalasHapusbuat yang suka otak-atik css, silahkeun...
kalo saya mah.. tambah pusing aja.. haha
oo gitu ya mas, baru tau bedanya.. lagian juga klo udah urusan utak-atik CSS pasti habis dech seharian waktu di depan komputer.
BalasHapusjd inget waktu sering maen di multiply nii kang.. huehehe.. selalu ajja berantem sama yg namanya kode2 kek di atas itu.. makanya saiia udah gag tengokin lagi tu MP saiia :( gag mampuhh!!! hehehe... lom cukup umur kali iia..
BalasHapusbadewe.. histogram?!?!? yg mana iia?!??!
wah, aku nggak begitu paham neh......ntar moga2 tambah paham deh masalah ginian
BalasHapus*manggut2*
BalasHapusmet sore kang... iia bener kang yg ada di photo :( makasii iia uda mampir :(
BalasHapus@suryaden:iya ya..haha..:D
BalasHapus@Benny:iya memang utak-atik css kadang ngabisin waktu jg..hehe..
@Genial:iya mas..memang saking banyaknya jd hrs bertempur sm tag ini hehe..:)
@Buwel:ya mgkn lama2 jg bs paham kok
@A-chen:thanks
@Genial:sama2 mas..
Wah tambah liuer euy.... tapi biar gimana saya harus bisa.... betul akang yusa?
BalasHapusmampir ngabuburit nunggu saur kang :)
BalasHapusada roko' kah atau kupi anget?!??!
@Haris:wah masa sih Ris..hehe..:)
BalasHapus@Genial:wah sama2 jg kang lah..hehe..sy jg mo mampir jg smbl ngabuburit yah..:)
Huhuhu..lumayan ribet juga yah mas
BalasHapustapi jadi agak bih tau lah. Kemaren nyoba utak-atik layout pusing 7 keliling ^0^
jelang malam
BalasHapussalam persahabatan ya
salam hangat selalu
nnahh klu sekarang.. ngabubuitnya saiia sambil makan choki-choki nii kang :)
BalasHapuskabuuuurr.. jangan bosen iia kang iia :(
@Belajar BLog:iya nih memang kl ngutak-ngutik tag kadang biking pusing juga hahaha..:)
BalasHapus@Bluethunderhart:salam persahabatan juga mas..:)
@Genial:ok sama2 ya mas Genial..haha.:D
baru tau yang tag2an kyak gini, blm mudeng, he he
BalasHapusok..ya sedikit2 sy jg hehe..:)
BalasHapus