Keluarkan Link Underline atau Buat Pautan Bertindan, atau Pautan yang Digaris Ganda
Secara lalai, pelayar web mempunyai gaya CSS tertentu yang digunakan untuk elemen HTML tertentu. Jika anda tidak menulis ganti lalai ini dengan helaian laman web anda sendiri, maka lalai akan dikenakan. Untuk hiperpautan, gaya paparan lalai adalah bahawa mana-mana teks yang dipautkan akan menjadi biru dan bergaris bawah. Penyemak imbas melakukan ini supaya pelawat tapak dapat dengan mudah melihat teks apa yang dikaitkan. Ramai pereka web tidak peduli dengan gaya lalai ini, terutamanya yang menggariskan. Syukurlah, CSS memudahkan untuk mengubah rupa mereka yang menggariskan atau mengeluarkannya sepenuhnya.
Mengeluarkan Underline pada Pautan Teks
Teks yang digariskan boleh menjadi lebih mencabar untuk membaca teks yang tidak digariskan. Di samping itu, banyak pereka hanya tidak mempedulikan rupa pautan teks yang digariskan. Dalam kes ini, anda mungkin ingin mengalihkan garis bawah ini sama sekali.
Untuk mengalih keluar garis bawah dari pautan teks, anda akan menggunakan hiasan teks teks harta CSS. Berikut adalah CSS yang anda tulis untuk melakukan ini:
a {text-decoration: none; }
Dengan satu baris CSS, anda akan mengalih keluar garis bawah dari semua pautan teks. Walaupun ini adalah gaya yang sangat umum (ia menggunakan pemilih elemen), ia masih mempunyai lebih spesifik daripada gaya penyemak imbas lalai. Kerana gaya lalai ini adalah apa yang menggariskan untuk memulakan, itu yang perlu anda tulis ganti.
Perhatian pada Menghapuskan Underlines
Secara visual, penyingkiran garis bawah mungkin betul-betul apa yang anda ingin capai, tetapi anda perlu berhati-hati apabila anda melakukan ini juga. Sama ada anda suka melihat pautan yang digariskan atau tidak, anda tidak boleh berhujah bahawa mereka membuatnya jelas mengenai teks mana yang dikaitkan dan yang tidak. Sekiranya anda mengambil garis bawah atau menukar warna pautan biru lalai, anda harus memastikan anda menggantikannya dengan gaya yang masih membenarkan teks yang dipautkan untuk ditonjolkan. Ini akan membuat pengalaman yang lebih intuitif untuk pelawat tapak anda.
Jangan Menggariskan Bukan Pautan
Berhati-hati lagi pada pautan dan garis bawah, jangan menggariskan teks yang bukan pautan sebagai satu cara untuk menekankannya. Orang-orang telah menjangkakan teks bergaris bawah menjadi pautan, jadi jika anda menggariskan kandungan untuk menambahkan penekanan (bukannya menjadikannya berani atau menyerlahkannya), anda menghantar mesej yang salah dan akan mengelirukan pengguna laman web.
Tukar Underline ke Dots atau Dashes
Sekiranya anda ingin mengekalkan pautan teks anda, tetapi mengubah gaya yang digariskan dari paparan lalai, iaitu "soldi", anda boleh melakukannya juga. Daripada garis pepejal itu, anda boleh menggunakan titik-titik untuk menggariskan pautan anda. Untuk melakukan ini, anda masih akan mengeluarkan garisan bawah, tetapi anda akan menggantinya dengan harta gaya bawah-sempadan:
a {text-decoration: none; sempadan bawah: 1px dihiasi; }Oleh kerana anda telah menyingkirkan garis bawah piawai, satu-satu titik adalah satu-satunya yang muncul.
Anda boleh melakukan perkara yang sama untuk mendapatkan tanda huru hara. Hanya ubah gaya sempadan bawah untuk putus-putus:
a {text-decoration: none; border-bottom: 1px dashed; }Tukar Warna Garis Warna
Satu lagi cara untuk menarik perhatian kepada pautan anda ialah menukar warna garis bawah. Hanya pastikan warna sesuai dengan skema warna anda.
a {text-decoration: none; sempadan bawah: 1px pepejal merah; }Underline Double
Caranya untuk menggunakan garis bawah berganda ialah anda perlu menukar lebar sempadan. Jika anda membuat sempadan lebar 1px, anda akan mempunyai garis bawah berganda yang kelihatan seperti garis bawah tunggal.
a {text-decoration: none; border-bottom: 3px double; }Anda juga boleh menggunakan garis bawah yang ada untuk membuat garisan berganda dengan ciri-ciri lain, seperti salah satu garisan yang di titik:
a {border-bottom: 1px double; }Jangan Lupakan Negeri Pautan
Anda boleh menambah gaya bawah sempadan pada pautan anda di negara yang berbeza seperti: hover,: active, atau: visited. Ini boleh mencipta pengalaman gaya "peralihan" yang bagus untuk pelawat apabila anda menggunakan kelas pseudo "hover" itu. Untuk membuat garis bawah titik kedua muncul apabila anda melayang di atas pautan:
a {text-decoration: none; } a: hover {sempadan bawah: 1px dihiasi; }Artikel asal oleh Jennifer Krynin. Diedit oleh Jeremy Girard