Tutorial Cara Mengubah Warna Background Selected Text Pada Blog

Kali ini saya akan membagikan Tutorial Mengganti Warna Background Selection Pada Text Link Image Dan Judul Blog .

Mungkin tutorial ini sudah banyak blogger jumpai di berbagai situs blog yang membahas tentang tutorial bloggers 🙂 tapi kali ini saya  +Febri Tri Harmoko  mencoba untuk memberikan tutorial yang berbeda dari semua nya 🙂

Untuk Contoh / Demo nya bisa lihat di bawah ini yah

Pada contoh di atas kita hanya menggunakan ::selectionuntuk Semua jenis Text yang ada dalam satu post trus bagaimana dengan background selection untuk judul , Text Link, Image, dan lain lain 🙂

Untuk Mengganti Background Selection pada Element lain kalian cukup menambahkan CSS element yang ingin di rubah warna backrgound Selection nya 🙂

kita ambil contoh untuk background Selection hanya pada paragraph saja.

Element untuk paragaraph dalam HTML itu di singkat dengan tag <p>jadi untuk penulisan CSS nya bisa lihat di bawah ini :

Penulisan Kode CSS untuk Text Link tambahkan huruf a di depan ::selection. Lihat Demo nya di bawah ini.

Selain dari contoh penggantian warna ::Selection di atas kita juga bisa gunakan untuk element gambar / <img> untuk lebih jelas nya bisa lihat contoh lengkap nya di bawah ini .

untuk Code nya bisa kamu gunakan CSS di bawah ini, dan letakan di atas </style> / ]]></b:skin>.

/* LINK */
::-moz-selection      { color: gold;  background: purple; } 
::selection      { color: gold;  background: purple; }

/* LINK */
a::-moz-selection { color: white; background: red; }
a::selection { color: white; background: red; }

/* Bold*/
b::-moz-selection { color: green; background: pink; }
b::selection { color: green; background: pink; }

/* paragraph*/
p::-moz-selection { color: white; background: black; }
p::selection { color: white; background: black; }

Udah dulu ya artikel tentang  Tutorial Mengganti Warna Background Selection Pada Text Link Image Dan Judul Blog 😀 sisanya kamu bisa berkreasi sendiri dengan CSS ini 🙂

Pelajari lagi dan terapkan di blog kamu. kalau misal masih bingun dan ada pertanyaan bisa kamu tulis di komentar, Semoga bermanfaat.