Cara Menghilangkan Garis Bawah Pada Link Menggunakan CSS
Jumat, 25 Mei 2018
Tulis Komentar
Beberapa hari yang lalu saya membuat sebuah desain untuk author box di blog, ketika saya memasukkan kode untuk membuat URL pada bagian nama ternyata link tersebut memiliki garis bawah.
Kemudian saya cek kembali kode css yang saya tulis dan ternyata memang benar ada kode css yang belum saya masukkan untuk mengatur link atau URL tersebut.
Link atau tautan yang memiliki garis bawah (underline) memang terlihat kurang enak dilihat, jadi saya ingin menghilangkan garis bawah yang ada pada link tersebut dengan menggunakan kode css.
Bagi yang masih awam dengan kode-kode bahasa pemrograman seperti HTML dan CSS mungkin masih bingung ketika membuat link kok malah ada garis bawahnya.
Sama saya juga memang masih bingung pada awal-awalnya, tapi setelah saya pelajari lagi akhirnya bisa juga untuk menghapus garis bawah (underline) pada link khususnya saya coba di blogger ya.
Cara Menghilangkan Garis Bawah Pada Link Dengan CSS
Contoh kode HTML pada URL/Link yang memiliki garis bawah (underline) :<a href="https://www.caramanual.com" title="Cara Manual">Cara Manual</a>
Hasilnya:
Cara Manual
Untuk mengilangkan garis bawah pada link tersebut, tambahkan kode css
text-decoration:none
untuk penerapannya seperti di bawah ini :Versi 1
Menghilangkan garis bawah pada link dengan menggunakan kode css, ini berlaku untuk semua link.
Tambahkan kode ini di atas kode
]]></b:skin>
atau </style>
a:link{text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
Keterangan:
a:link
setiap link tidak akan menampilkan garis bawah.:visited
setiap link yang pernah di klik tidak akan menampilkan garis bawah.a:hover
setiap link ketika di sentuh cursor di atasnya tidak akan menampilkan garis bawah.Kode baris pertama wajib Anda gunakan untuk menghilangkan garis bawah pada link atau URL, untuk baris kedua dan ketiga merupkana opsional tambahan, tapi saran saya gunakan saja semuanya.
Versi 2
Mengilangkan garis bawah atau underline pada hyperlink dengan menerapkannya langsung dibagian kode HTML, ini hanya akan menghilangkan garis pada link itu saja.
Misalnya kode HTML seperti ini:
<a href="https://www.caramanual.com" title="Cara Manual">Cara Manual</a>
Lalu tambahkan kode
style="text-decoration:none"
di dalamnya, untuk penerapannya seperti di bawah ini:<a style="text-decoration:none" href="https://www.caramanual.com" title="Cara Manual">Cara Manual</a>
Nah, itulah beberapa cara untuk menyembunyikan atau menghilangkan garis bawah pada link di blog atau website sangat mudah bukan? silahkan Anda coba terapkan sendiri.
Sebenarnya masih ada cara lain untuk menghilangkan garis bawah pada url blog, namun agak sedikit rumit jadi saya hanya menjelaskannya yang mudah di pahami oleh semua orang.
Sekian artikel mengenai cara menghilangkan garis bawah pada link menggunakan css, jika ada masukkan atau pertanyaan silahkan hubungi kami melalui halaman kontak, semoga bermanfaat.
Belum ada Komentar untuk "Cara Menghilangkan Garis Bawah Pada Link Menggunakan CSS"
Posting Komentar
1. Centang kotak Notify me untuk mendapatkan notifikasi komentar.
2. Komentar kami moderasi, dan tidak semuanya dipublish.
3. Semua komentar dengan menambahkan link akan dihapus dan tidak akan dipublikasikan.