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
- Login ke akun Blogger Anda
- Masuk ke menu Layout
- Klik Edit HTML
- Cari bagian CSS yang mengatur
a:link
dana: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!
3 Komentar
thanks bange tipsnya, langsung cobaaaa
BalasHapus
BalasHapuskumpulan solusi servis ponselmakasih gan
Maknyuss ilmunya..
BalasHapus