Sunday, December 6, 2015

Cara Mengubah Warna Seleksi/Block Teks Blog dengan CSS3

Cara Mengubah Warna Teks yang di Blok dengan CSS3

Assalamu'alaikum warohmatullahi wabarokatu. Pada posting kali ini saya akan membahas mengenai cara mengubah warna teks yang di blok dengan menggunakan kode CSS. Mungkin sebelumnya sobat pernah menemukan blog lain diluar sana yang memodifikasi warna teksnya ketika di block. Untuk melakukan hal yang sama, sobat juga bisa, berikut ini caranya.

Pertama-tama buka dashboard blogger sobat, pilih Template > Edit HTML. Setelah itu cari kode ]]></b:skin> kemudian letakkan kode berikut diatasnya.

::selection {background:#EAF514;color:#F65A96;}
::-moz-selection {background:#EAF514;color:#F65A96;}
::-webkit-selection {background:#EAF514;color:#F65A96;}

Perhatikan kode warna diatas, silahkan ganti semua kode warna #EAF514 dengan warna background teks ketika di block dan ganti semua kode warna #F65A96 dengan warna teks juga ketika di block. Ada hal yang perlu sobat perhatikan dimana kedua kode warna tersebut sebaiknya merupakan warna yang saling kontras, artinya kedua warna yang digunakan (background & text color) harus tampak berbeda agar teks terlihat jelas bahkan saat di seleksi atau di block. Silakan coba seleksi teks dibawah untuk melihat contohnya.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas porttitor congue massa.
Fusce posuere, magna sed pulvinar ultricies, purus lectus malesuada libero, sit amet commodo magna eros quis urna. Nunc viverra imperdiet enim.
Fusce est. Vivamus a tellus.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin pharetra nonummy pede.
Mauris et orci. Aenean nec lorem.

Sedangkan jika sobat ingin menggunakan warna untuk kelas atau ID tertentu sobat bisa menggunakan kode CSS (misal untuk kelas .header) sobat bisa menggunakan kode :

.header::selection {
    background: #EAF514;
    color: #F65A96;
}

Mungkin cukup itu saja, sangat singkat bukan. Namun semoga itu bisa berguna untuk sobat, jika ada yang ingin ditanyakan silahkan sampaikan di kotak komentar dibawah atau melalui halaman contact yang bisa dibuka di menu blog paling atas. Terima kasih, assalamu'alaikum.

Sumber : http://xxpc123xx.blogspot.co.id/2013/05/cara-merubah-warna-teks-yang-di-blok.html
Disqus Comments