Pencarian

Custom Search

03 September 2009

Perbedaan antara tag id dan class

16 komentar :

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

16 komentar :

  1. wohoho...

    buat yang suka otak-atik css, silahkeun...

    kalo saya mah.. tambah pusing aja.. haha

    BalasHapus
  2. oo gitu ya mas, baru tau bedanya.. lagian juga klo udah urusan utak-atik CSS pasti habis dech seharian waktu di depan komputer.

    BalasHapus
  3. jd 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..

    badewe.. histogram?!?!? yg mana iia?!??!

    BalasHapus
  4. wah, aku nggak begitu paham neh......ntar moga2 tambah paham deh masalah ginian

    BalasHapus
  5. met sore kang... iia bener kang yg ada di photo :( makasii iia uda mampir :(

    BalasHapus
  6. @suryaden:iya ya..haha..:D

    @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..

    BalasHapus
  7. Wah tambah liuer euy.... tapi biar gimana saya harus bisa.... betul akang yusa?

    BalasHapus
  8. mampir ngabuburit nunggu saur kang :)
    ada roko' kah atau kupi anget?!??!

    BalasHapus
  9. @Haris:wah masa sih Ris..hehe..:)

    @Genial:wah sama2 jg kang lah..hehe..sy jg mo mampir jg smbl ngabuburit yah..:)

    BalasHapus
  10. Huhuhu..lumayan ribet juga yah mas
    tapi jadi agak bih tau lah. Kemaren nyoba utak-atik layout pusing 7 keliling ^0^

    BalasHapus
  11. jelang malam
    salam persahabatan ya
    salam hangat selalu

    BalasHapus
  12. nnahh klu sekarang.. ngabubuitnya saiia sambil makan choki-choki nii kang :)

    kabuuuurr.. jangan bosen iia kang iia :(

    BalasHapus
  13. @Belajar BLog:iya nih memang kl ngutak-ngutik tag kadang biking pusing juga hahaha..:)

    @Bluethunderhart:salam persahabatan juga mas..:)

    @Genial:ok sama2 ya mas Genial..haha.:D

    BalasHapus
  14. baru tau yang tag2an kyak gini, blm mudeng, he he

    BalasHapus
  15. ok..ya sedikit2 sy jg hehe..:)

    BalasHapus