Featured Post

Kegunaan Nilai !important pada Properti CSS

on
Sering kali kita menjumpai penulisan CSS secara inline di sebuah halaman web. Apalagi ketika kamu mendapat tugas untuk mengubah sebuah style dari beberapa elemen yang ditulis inline.

Prioritas inline adalah yang paling tinggi jika dibandingkan dengan penulisan CSS secara internal maupun eksternal. Hal itu menjadi dilema yang tak kunjung habisnya saat kita hanya mengubah style berdasarkan selektor dengan eksternal CSS.Bagaimana menyelesaikan kasus ini?

Solusi

Cara menyelesaikan kasus ini adalah dengan memahami nilai !important dari properti selektor yang ditulis inline. Berikut adalah kode dan hasil dari penggunaan !important. Amati dan pahami, kamu akan tahu bagaimana !important bekerja.

html-important.html

css-important.css

Hasil render menggunakan !important

Kesimpulan

Browser melakukan render dengan prioritas CSS penulisan inline di atas CSS penulisan internal dan eksternal. Namun, dengan adanya !important, browser mengubah prioritasnya.
Hai, saya hanya blogger yang nulis sejak 2008 lalu. Saat ini sedang asyik mengembangkan Game of Calculator

Mungkin Kamu Juga Suka...

Comments

  1. Arr RianMay 2, 2013 at 7:13 PM

    pertama berkunjung, pengen bisa buat template sendiri mohon bantuannya ya pasangan baru :D

    ReplyDelete
  2. Enny MamitoMay 3, 2013 at 2:20 PM

    dtg berkunjung ya :)

    ReplyDelete
    Replies
    1. Enny LawMay 3, 2013 at 2:22 PM

      mongga mba :)

      Delete
    2. IskaMay 3, 2013 at 2:28 PM

      harusnya "monggo" :D

      Delete
    3. R10May 3, 2013 at 3:37 PM

      Mangga kali maksudnya :D

      Delete
    4. IskaelMay 3, 2013 at 4:28 PM

      itu kan emang perpaduan jawa barat dan jawa tengah LOL

      Delete
    5. Arr RianMay 9, 2013 at 6:31 AM

      subahanallah, pasangan yang harmonis bersatu dalam sebuah blog :D

      Delete
    6. IskaMay 9, 2013 at 9:30 AM

      wekekek ... begitulah :D

      Delete
  3. Ummu El NurienMay 4, 2013 at 10:03 AM

    templatenya cool.. enak sekali di pandang...

    soal kaya ginian, aku benar-benar ga nyambung..padahal juga sangat penting di pelajari bagi orang yang punya blog..

    ReplyDelete
  4. Rohis FacebookMay 8, 2013 at 7:35 PM

    nyimak..., agak2 oon sy klo css *smile

    ReplyDelete
  5. PencukurBumiMay 18, 2013 at 7:59 AM

    Pada intinya hirarki prioritas CSS untuk browser tuh:
    1. !important CSS
    2. Inline CSS
    3. Target khusus dalam CSS (semakin detil target semakin tinggi prioritasnya)
    4. Target Global dalam CSS

    Sebenarnya sebuah Styling bisa mendapatkan prioritas lebih tinggi daripada !important, yakni dengan menggunakan javascript. Namun karena langkanya kesempatan untuk menggunakan metode tersebut, maka aku memutuskan untuk tidak membahasnya lebih jauh lagi.

    Kuharap info tersebut dapat membantu.

    ReplyDelete
    Replies
    1. IskaMay 18, 2013 at 9:08 AM

      makasih :D

      dan karena itu aku sekarang mulai belajar JavaScript, walaupun dimulai dengan jQuery terlebih dahulu :D

      Delete

Post a Comment

Subscribe to: Post Comments (Atom)
©2013-2024 Belajar Ngeblog bersama Iskael. All rights reserved.