Sabtu, 16 Juni 2012

1 mengubah warna text ketika di block


Cara Mengubah Warna Pada Teks/Tulisan Yang Di Blok (Text Selection)  

Text Selection
Pada dasarnya, setiap browser ketika pemilik memblok teks/tulisan pada suatu blog/website menggunakan warna biru pada background dan warna putih pada teks/tulisan atau bahasa luna maya-nya "text selection". Namun, kita dapat mengubah/modifikasinya sedikit dengan mengubahnya dengan warna lain baik background maupun teks/tulisannya. Caranya adalah dengan dibantunya CSS3, yaitu ::selection. kode ini didukung oleh semua browser kecuali Internet Explorer, padahal browser tersebut dibuat. Untuk Mozilla Firefox perlu ditambahkan -moz- sebagai notifikasi agar dapat dibaca/dikenali oleh browser tersebut. Sebagai contoh dibawah ini.
::selection{color:#ff0000;}
::-moz-selection{color:#ff0000;}
Nah, terakhir adalah cara pemasangannya. check it..
Berikut langkah-langkahnya:
1. Pastikan anda sudah login ke akun Blogger anda.
2. Masuk ke halaman Rancangan dan klik Edit HTML.
3. Cari kode ]]></b:skin> dan letakan kode berikut tepat dibawah kode tersebut.
::selection {background:#FF0000;color:#FFFFFF}
::-moz-selection {background:#FF0000;color:#FFFFFF}
::-webkit-selection {background:#FF0000;color:#FFFFFF}
 4. Finally, Save Template. Done!


Note:
1. Kode yang berwarna merah adalah kode warna/hex color sebagai background. Silahkan ganti sesuai selera.
2. Kode yang berwarna biru adalah kode warna/hex color sebagai warna teks. Silahkan ganti sesuai selera.

PENTING UNTUK DIBACA!!

Pada blog ini, saya menerapkan tutor tersebut berjalan dengan baik. Namun dibeberapa template biasanya tidak berjalan dengan baik.
So, jika hal itu terjadi pada blog anda, saya sarankan untuk mempergunakan kode css dibawah ini dan letakan diatas kode </head>, perbedaanya anda hanya harus menambahkan kode <style type='text/css'>...</style> diantara kode CSS tersebut sehingga menjadi seperti dibawah ini:
<style type='text/css'>
::selection {background:#FF0000;color:#FFFFFF}
::-moz-selection {background:#FF0000;color:#FFFFFF}
::-webkit-selection {background:#FF0000;color:#FFFFFF}
 </style>
Sumber

1 komentar:

Anonim mengatakan...

artikelnya sangat mantap nih.... thanks udah berbagi...

Posting Komentar

>>><<<