CSS Dasar Dalam Menggunakan Teks Sebagai Hyperlink

CSS Dasar Dalam Menggunakan Teks Sebagai Hyperlink

Hal yang paling sederhana untuk mengarahkan user ke media utama dengan menggunakan cara hyperlink. Teknik ini banyak digunakan oleh developer. Mulai dari gambar, teks, flash, ataupun video semuanya dapat dijadikan sebuah hyperlink. Banyak website atau situs-situs yang telah menyediakan toolbar hyperlink untuk memudahkan writer dalam membuat sebuah hyperlink. Perlu diketahui juga, bagaimana proses manual dalam membuat sebuah hyperlink. Disini Bier Pinter akan membahas CSS dasar dalam menggunakan teks sebagai hyperlink.

Belajar CSS Dasar Dalam Menggunakan Teks Sebagai Hyperlink

Materi ini akan mengajarkan anda bagaimana membuat sebuah hyperlink secara manual dan bagaimana memodifikasi hyperlink tersebut agar terlihat lebih menarik. Dalam tahap memodifikasi, developer harus memasukkan CSS kedalam website. Biasanya CSS diterapkan pada bagian header website sebelum tanda </head> dilembar html.

Beberapa properti Hyperlink yang dapat kamu modifikasi menggunakan CSS, terdapat 4 properti:

  1. Properti :link menunjukkan hyperlink sedang tidak dikunjungi.
  2. Properti :visited menunjukkan hyperlink yang dikunjungi.
  3. Properti :hover menunjukkan keterangan atau perubahan teks ketika mouse user sedang mengarah ke hyperlink.
  4. Properti :active menunjukkan elemen dimana user mengklik saat ini.

Hal yang harus diketahui sebelum memodifikasi stylesheet css, a :hover harus come setelah :link dan a :visited agar struktur css lebih efektif. Setelah itu a :active harus come setelah a :hover. Kamu bisa lihat contoh struktur CSS dalam membuat sebuah hyperlink.

Gunakan lembar CSS diatas sebagai contoh untuk mode latihan Anda. Kamu juga bisa perhatikan hasil CSS diatas dibawah ini.

Memberikan Hyperlink Pada Gambar Menggunakan CSS

Sedikit tambahan, sesuai judulnya Bier Pinter akan membuat hyperlink pada sebuah gambar. Perhatikan tanda <a href=””> ini merupakan hyperlink pada gambar tersebut. Tanda class itu merupakan kelas pada sebuah gambar. Class berbeda akan memberikan mode tampilan yang berbeda. Tanda src itu adalah sumber url pada gambar tersebut. Tanda alt merupakan keterangan pada gambar. Tanda width dan height itu merupakan ukuran dari gambar tersebut. Jangan lupa akhiri semuanya dengan tanda </a>. Perhatikan kode dibawah ini:

Demikian materi CSS Dasar Dalam Menggunakan Teks Sebagai Hyperlink yang telah dijelaskan oleh BierPinter. Jika ini bermanfaat, teman-teman jangan lupa like dan share ya. 🙂