Cara Mengganti Warna Text Saat Di Select (Block) Selection Text

highlight text selection

Tutorial CSS Merubah Warna Text Ketika Di Block / Select ( highlight selection text )

Tutorial Merubah Warna Background Dan Color Text Ketika Di select / Block | Kalian juga dapat mengganti warna background dan text pada div / pembungkus arahan yang berbeda..

Misalanya pada tag pre code, blockquote, .class, #id / pada tag <html> lainnya.. Contohnya Pada Kode dibawh ini, Silahkan block text yang ada di dalam kotak ini

Note | The ::selection pseudo-element was drafted for CSS Selectors Level 3, but removed before the Recommendation status. So, at the moment, the ::selection pseudo-element is not in any specification. (However, it may be re-added to future CSS specifications.)
Nah bagi kalian yang ingin mencobanya, dapat gunakan css dibawah ini

Mengganti semua warna background dan text saat di select

 ::-moz-selection { /* Css Untuk Browser Firefox */   background-color: #c6538a;   color: #ffffff }  ::selection {   background-color: #c6538a;   color: #ffffff }

Jika kalian ingin merubah text yang di select pada tag tertentu tinggal tambahkan tag / class di depan :: (titik dua dua kali) teladan

Mengganti warna background dan text saat di select Pada Tag Tertentu

 blockquote::-moz-selection {  /* Css Untuk Browser Firefox */   background-color: #c6538a;   color: #ffffff }  blockquote::selection {   background-color: #c6538a;   color: #ffffff }


Nah, kini kalian tinggal pilih, mau yg mana. kalo sudah di tentukan, tinggal pasang pada template blog kalian..

Tutorial Pemasangannya...
  • Login ke blog kalian, lalu
  • Masuk ke sajian Template, Edit HTML
  • Lalu cari arahan </b:skin>, gunakan CTRL+F di kumpulan arahan HTML untuk mempermudah pencarian
  • Setelah ketemu, kalian copy css selection tadi dan masukan sempurna diatasnya
  • Save Template dan selesai..

Jangan lupa mampir ke tutorial lainnya ya gan :)

Tutorial Blogger Lainnya :


Cukup sekian dan terima kasih, biar artikel tentnag Costum highlight selection text ini bermanfaat..

Comments

Post a Comment

Popular posts from this blog

Membuat Multi Tab Server Video Streaming Ibarat Layarkaca21

Image
Tutorial Cara Membuat Multi tab Video Streaming Click to Load Iframe Memasang Tab Pilihan Server Untuk Video Streaming di Blog , kali ini saya akan membagikan lagi sebuah widget untuk blog movie yang akan menampilkan beberapa pilihan server dan kualitas video yang berbeda ibarat pada wrbsite layar kaca Buat kalin yang menciptakan blog moveie tentunya harus menciptakan beberapa video / Film cadangan di server yang berbeda untuk jaga-jaga apabila di server yang satunya ada problem / sedang maintenance. Sebelumnya saya juga sudah pernah share artikel yang sama tapi pada tutorial sebelumnya video yang di pasang akan diload secara bersamaan dikala blog / halaman di buka. Nah pada widget Responsive Multi Tab Video Streaming ini video / iframe yang ada didalamnya akan di load dikala tombol button di klik . Makara tidak akan memberatkan loading blog kalian.. Demo Multi Tab Video Streaming Nah untuk tutorialnya kalian dapat ikuti langkah demi langkah dibawah ini Membuat Multi Tab S...
Read more

Membuat Multi Tab Video Streaming Responsive Di Blog

Image
Cara memasang multi tab video streaming responsive di blog Pada postingan kali ini aku akan mengembangkan wacana multi tab video streaming . Kaprikornus kalian sanggup memasukan 3 (tiga video)bisa untuk pilihan chanel atau sanggup untuk menambah vido lanjutannya. sanggup juga kalian menaruh beberapa video dengan kualitas yang berbeda, sanggup juga menaruh video dengan server yang berbeda, buat cadangan apa bila uploadan video / film di server yang satu tidak sanggup di play. Demo Tampilan Multi Tab Video Streaming Responsive Di Blog Nah bagi kalian yang igin memasang multi tab video streaming youtube responsive di blog , silahkan ikuti langkah demi langkah berikut ini. Login ke Blogger.com Masuk ke Tab Template -> Klik Edit HTML . Cari Code </head> Lalu masukan css dibawah ini sempurna di atas isyarat tadi. <style type='text/css'> .tab-buttons{ overflow:auto; text-align: center; } .tab-buttons button{ background:#363f45; ...
Read more

Cara Menciptakan Recent Comments Disqus

Image
Cara Membuat Widget Recent Comments Disqus Di Blog Cara Memasang Recent Comments Disqus Di Blogger , Pada postingan kali ini saya selaku admin blog mas tamvan akan menyebarkan tutorial memasang sebuah widget komentar disqus di website blogger. Widget Komentar terbaru ini khusus bagi kalian yang memasang komentar disqus di blognya, jadi kalo kalian memasang widget ini tapi tidak memasang komentar disqus atau tidak ada yang komentar di akun disqus kalian. maka tampilannya akan kosong. Buat kalian yang memasang komentar bawaan blogger, mungkin nanti saya akan posting d lalu hari.. Widget komentar disqus ini sangat simple kalian tinggal pasang dan udah jadi tinggal sesuain sendiri tampilannya dengan selera kalian. Okeh tanpa basa busuk lagi mari kita masuk ke tahap pemasangan widget recent comments disqus di blog. Login ke Blogger.com Masuk ke Tataletak , klik Tambahkan Gadget atau add widget Lalu cari dan klik HTML/Javascript , teladan lihat gambar. S...
Read more