Fungsi CSS !important dan penerapanya

Fungsi CSS !important dan penerapanya

fungsi css important

       Memang penerapanya tidak terlalu popular seperti original css asli.Tetapi fungsi !important sangatlah rumayan penting bagi css yang benar - benar tidak bisa di ubah nilai value defaultnya .

Jika css default stylesheet anda nilainya tidak bisa di ubah, maka gunakanlah fungsi !important ini .

Berikut merupakan fungsi yang bisa anda terapkan dengan apache server local / yang lainya :

-  Contoh saja kode css berikut :

span { border:1px solid black;
background-color:red;
color:#fff;
border-radius:3px;
}
Ketika ingin mengubah elemen induk dan ternyata tidak bisa di ganti nilainya.

Contoh border di span -> border:1px solid black dan tentunya, pada saat pengeditan tampilan css di elemen induk lainya contoh, seperti kode berikut, yang dimana akan merubah nilai defaulnya yang tidak bisa di ubah, maka sekarang fungsi !important sangatlah penting ! .

Sebagai contoh, saya akan menghilangkan bordernya.
- Dengan kode css !important :
.box span{ border:none !important;}
Permasalahan :
- background-color:red tidak bisa diubah ?
- color:#fff; sudah dianggap nilai default .
- border-radius:3px; // tidak bisa di ubah

Inti dari penerapan tersebut :
 - Jika kedua elemen saling berdempetan / lebih akrabnya tidak bisa di ubah salah satu elemen yang  sifatnya duplikasi induk .

Logikanya :

Default :
Elemen A -><- Elemen B(x)

Ubah :
Elemen A(y) -><- Elemen B(y)

Sebenarnya fungsi tersebut merupakan hal yang melanggar aturan stylesheet css .

Perlu di ingat

- Fungsi !important mempunyai kekurangan dan kelebihan, maka gunakanlah hanya untuk sebuah elemen induk yang tidak bisa di ubah nilai defaultnya .

- Jika tidak terlalu penting, maka tidak usah menggunakan fungsi tersebut .

- Jika memang ingin menggunakanya untuk membuat gaya stylesheet yang menawan, bisa anda terapkan .

Sebenarnya fungsi tersebut tidak penting, dikarenakan sudah nilai defaultnya elemen pertama yang terstruktur dengan baik .

tags : penerapan dan fungsi css !important


Selanjutnya
« Sebelumnya
Sebelumnya
Post Selenjutnya »

Please enable Javascript![ ? ]