Header Ads Widget

Ebook GRATIS Bisnis Online dari Nol - Banner Post Ads Uka Fahrurosid

Latest

6/recent/ticker-posts

Trik Mengubah Warna dan Memperbesar Link URL Saat Diklik

Pelajari cara mudah mengubah warna dan ukuran link URL saat diklik hanya dengan mengedit kode HTML dan CSS di Blogger.

Contoh tampilan link URL yang berubah warna dan ukuran saat diklik

Cara Membuat Link URL Berubah Warna dan Ukuran Saat Diklik

Pernah nggak, Anda melihat link di sebuah website yang langsung berubah warna atau ukuran waktu kursor diarahkan ke sana? Nah, itu bukan sulap, tapi trik simpel dari CSS. Artikel ini akan bahas step-by-step cara membuat efek keren itu di Blogger, biar tampilan blog Anda makin kece dan interaktif.

Apa Itu a:link dan a:hover?

Dalam dunia HTML dan CSS, a:link adalah style untuk link biasa yang belum disentuh, sementara a:hover adalah efek saat kursor diarahkan ke link tersebut. Nah, dua kode inilah yang jadi kunci untuk mengubah tampilan link agar lebih menarik.

Langkah-langkah Edit Link di Blogger

  1. Login ke akun Blogger Anda
  2. Masuk ke menu Layout
  3. Klik Edit HTML
  4. Cari bagian CSS yang mengatur a:link dan a:hover

Setelah itu, masukkan kode berikut sebagai contoh dasar:

a:link {
  color: #0000ff;
  font-size: 10px;
  cursor: default;
}

a:hover {
  color: #d2691e;
  font-size: 19px;
  font-style: italic;
  cursor: wait;
}

Penjelasan Kode

  • color: menentukan warna teks link
  • font-size: mengatur ukuran font link
  • font-style: bisa diatur jadi italic, bold, dll
  • cursor: tampilan kursor saat hover (bisa wait, pointer, help, dsb)

Tips Tambahan

Jangan terlalu banyak efek mencolok, cukup yang simpel tapi elegan. Pastikan juga kombinasi warna tetap nyaman dilihat dan nggak bikin pengunjung kabur karena pusing lihat link yang 'kelap-kelip'.

Kesimpulan

Mengubah tampilan link saat diklik atau disorot itu nggak susah. Dengan memanfaatkan a:link dan a:hover di CSS Blogger, Anda bisa bikin blog tampil lebih hidup dan profesional. Sekarang giliran Anda praktik langsung!

Ayo Coba dan Share!

Udah coba trik ini di blog Anda? Share hasilnya di kolom komentar ya! Jangan lupa bagikan artikel ini ke teman yang butuh biar makin banyak yang dapet manfaatnya!

Semoga Bermanfaat!

Miliki ebook GRATIS yang akan bantu kamu cuan dari dunia digital.

Dapatkan di Sini!

Follow @ukafahrurosid

Posting Komentar

3 Komentar

Banner Ads 728x90