Pelajari Cara Mudah untuk Buang Undur Dari Pautan dalam HTML

Langkah-langkah untuk membuang garis bawah dari pautan teks dan isu yang perlu diperhatikan

Secara lalai, kandungan teks yang dikaitkan dengan HTML menggunakan elemen atau "anchor" digelar dengan garis bawah. Sering kali, pereka web memilih untuk menghapus gaya penggera ini dengan membuang garis bawah.

Ramai pereka tidak peduli untuk melihat teks bergaris bawah, terutamanya dalam blok kandungan padat dengan banyak pautan. Semua perkataan yang digariskan itu benar-benar boleh memecahkan aliran bacaan dokumen. Ramai yang berpendapat bahawa mereka yang menggariskan sebenarnya membuat kata-kata lebih keras untuk membezakan dan membaca dengan cepat kerana cara yang menggariskan perubahan bentuk huruf semulajadi.

Walau bagaimanapun, terdapat manfaat yang sah untuk mengekalkan garis bawah ini pada pautan teks. Contohnya, apabila anda melayari blok teks yang besar, pautan yang digarisbawahi dengan warna kontras yang betul memudahkan para pembaca untuk segera mengimbas halaman dan melihat di mana pautan tersebut. Jika anda melihat artikel reka bentuk web di sini di About.com, serta artikel lain di laman web ini, anda akan melihat gaya penjejakan ini digambarkan.

Sekiranya anda membuat keputusan untuk menghapus pautan dari teks (proses mudah yang akan kita tutupi tidak lama lagi), pastikan anda mencari cara untuk menstrukturkan teks itu untuk membezakan apa yang merupakan pautan dari teks biasa. Ini paling sering dilakukan dengan kontras warna yang disebutkan di atas, tetapi warna sahaja boleh menimbulkan masalah kepada pelawat yang mengalami masalah visual seperti buta warna. Bergantung pada bentuk buta warna tertentu mereka, kontras mungkin hilang sepenuhnya pada mereka, menghalang mereka daripada melihat perbezaan antara teks berkaitan dan tidak berkaitan. Inilah sebab mengapa teks yang digariskan masih dianggap sebagai cara terbaik untuk menunjukkan pautan.

Jadi bagaimana anda mematikan garis bawah jika anda masih mahu berbuat demikian? Oleh kerana ini adalah ciri visual yang kita bimbangkan, kita akan beralih ke bahagian laman web kami yang mengendalikan semua perkara visual - CSS.

Gunakan Lembaran Gaya Cascading untuk Mematikan Underlines di Pautan

Dalam kebanyakan kes, anda tidak mahu mengubah garis bawah hanya dengan satu pautan teks. Sebaliknya, gaya reka bentuk anda mungkin mengharuskan anda membuang garis bawah dari semua pautan. Anda akan melakukan ini dengan menambahkan gaya ke gaya gaya luaran anda.

a {text-decoration: none; }

Itu sahaja! Bahawa satu baris mudah CSS akan mematikan garis bawah (yang sebenarnya menggunakan sifat CSS untuk "teks-dekorasi") pada semua pautan.

Anda juga boleh mendapatkan lebih spesifik dengan gaya ini. Sebagai contoh, jika anda hanya mahu mematikan garis bawah atau pautan di dalam elemen "nav", anda boleh menulis:

nav a {text-decoration: none; }

Sekarang, pautan teks pada halaman akan mendapat penggaris lalai, tetapi mereka yang berada di nav akan memindahkannya.

Satu perkara yang banyak pereka web memilih untuk lakukan adalah untuk menjadikan pautan kembali "pada" apabila seseorang melayang ke atas teks. Ini akan dilakukan dengan menggunakan: hover CSS pseudo-class, seperti ini:

a {text-decoration: none; } a: hover {text-decoration: underline; }

Menggunakan CSS Inline

Sebagai alternatif untuk membuat perubahan pada lembaran gaya luaran, anda juga boleh menambah gaya secara langsung ke elemen itu sendiri dalam HTML, seperti ini:

pautan ini tidak mempunyai garis bawah

Masalah dengan kaedah ini ialah ia meletakkan maklumat gaya di dalam struktur HTML anda, yang bukan amalan terbaik. Gaya (CSS) dan struktur (HTML) hendaklah disimpan berasingan.

Sekiranya anda mahu semua pautan teks tapak mempunyai garis bawah dikeluarkan, menambah maklumat gaya ini kepada setiap pautan secara individu bermakna jumlah markup tambahan ditambahkan ke kod tapak anda. Muncul halaman ini boleh melambatkan masa beban tapak dan menjadikan pengurusan laman keseluruhan lebih mencabar. Atas sebab-sebab ini, lebih baik untuk sentiasa beralih kepada gaya gaya luaran untuk semua keperluan gaya halaman.

Dalam Penutupan

Sebaik sahaja menghapus garisan bawah dari pautan teks laman web, anda juga harus sedar tentang akibatnya. Walaupun ia sememangnya boleh membersihkan rupa halaman, ia boleh melakukannya dengan mengorbankan kebolehgunaan secara keseluruhan. Ambil perhatian ini pada kali berikutnya anda menganggap mengubah "sifat teks-hiasan" halaman.

Artikel asal oleh Jennifer Krynin. Disunting pada 9/19/16 oleh Jeremy Girard