Bagaimana untuk mengalih keluar garis bawah daripada pautan dalam CSS

Dalam proses penghasilan halaman web, kita selalunya perlu menggunakan helaian gaya CSS untuk mencantikkan kesan halaman. Kesan yang sangat biasa dalam CSS ialah menggariskan pautan. Tetapi kadangkala, kami ingin mengalih keluar garis bawah pautan untuk mencapai kesan visual yang lebih baik. Jadi, bagaimana untuk mengalih keluar garis bawah pautan dalam helaian gaya CSS? Mari belajar bersama.

Kaedah 1: atribut hiasan teks

Dalam helaian gaya CSS, dengan menetapkan nilai atribut hiasan teks kepada tiada, anda boleh mengalih keluar kesan garis bawah pautan.

Contohnya:

a {
text-decoration:none;
}

Kod di atas bermakna semua pautan dalam halaman web akan digariskan .

Perlu diambil perhatian bahawa selain daripada menetapkan atribut hiasan teks kepada tiada, ia juga boleh ditetapkan kepada nilai lain, seperti garis bawah, garis atas, baris melalui, dsb. Jika anda perlu menukar garis bawah pautan kepada gaya lain, anda boleh membuat tetapan yang sepadan mengikut keperluan.

Kaedah 2: atribut border-bottom

Cara lain untuk mengalih keluar garis bawah pautan ialah menggunakan atribut border-bottom. Kesan kaedah ini adalah sama seperti mengalih keluar garis bawah daripada atribut hiasan teks.

Contohnya:

a {
border-bottom:none;
}

Kod di atas bermaksud semua pautan dalam halaman web akan digariskan .

Perlu diambil perhatian bahawa selain daripada menetapkan atribut bahagian bawah sempadan kepada tiada, ia juga boleh ditetapkan kepada nilai lain, seperti pepejal, bertitik, putus-putus, dsb. Jika anda perlu menukar garis bawah pautan kepada gaya lain, anda boleh membuat tetapan yang sepadan mengikut keperluan.

Kaedah 3: Pemilih kelas pseudo

Selain daripada dua kaedah di atas, anda juga boleh menggunakan pemilih kelas pseudo untuk mengalih keluar kesan garis bawah pautan.

Contohnya:

a:link {
text-decoration:none;
}

Kod di atas bermakna ia hanya tersedia apabila pautan belum diakses (iaitu status "Tidak dilawati"), kesan garis bawah pautan dialih keluar. Jika anda ingin mengalih keluar garis bawah pautan dalam keadaan berbeza seperti "dilawati", "melewati tetikus" atau "diklik", anda boleh menggunakan pemilih kelas pseudo berikut masing-masing:

a:dilawati (keadaan dilawati)
a:hover (apabila tetikus melayang)
a:active (apabila ia diklik)

Contohnya:

a:hover {
hiasan teks: tiada ;
}

Kod di atas bermakna kesan garis bawah pautan akan dialih keluar hanya apabila tetikus melayang di atas pautan.

Perlu diambil perhatian bahawa pemilih kelas pseudo hanya boleh digunakan untuk teg dan tidak boleh digunakan untuk elemen lain.

Ringkasan

Di atas ialah tiga cara untuk mengalih keluar garis bawah pautan, menggunakan atribut hiasan teks, atribut bawah sempadan dan pemilih kelas pseudo. Dalam aplikasi praktikal, pelbagai kaedah boleh digunakan dalam kombinasi untuk mencapai kesan yang berbeza. Pada masa yang sama, anda perlu berhati-hati agar tidak menjejaskan kebolehbacaan halaman dan pengalaman pengguna apabila mengubah suai gaya pautan.

Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar garis bawah daripada pautan dalam CSS. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!