Rumah > hujung hadapan web > tutorial css > Bagaimana untuk Menggayakan Pautan tanpa Menggariskan Elemen Span Tertentu?

Bagaimana untuk Menggayakan Pautan tanpa Menggariskan Elemen Span Tertentu?

DDD
Lepaskan: 2024-12-16 13:09:12
asal
342 orang telah melayarinya

How to Style Links without Underlining a Specific Span Element?

Menggayakan Pautan tanpa Menggariskan Elemen Tertentu

Apabila cuba menggayakan pautan dengan garis bawah, adalah perkara biasa untuk menghadapi situasi di mana anda mungkin mahu mengecualikan elemen tertentu dalam pautan daripada digariskan. Dalam kes ini, anda telah menghadapi cabaran dalam menggunakan gaya tertentu pada elemen #myspan tanpa menjejaskan garis bawah pada pautan yang lain.

Untuk menyelesaikan isu ini, pertimbangkan penyelesaian berikut:

Ubah suai perisytiharan CSS untuk elemen #myspan dan tetapkan sifat paparannya kepada "sekatan sebaris". Perubahan ini dengan berkesan menjadikan #myspan menduduki ruangnya sendiri dalam pautan, memisahkannya daripada teks yang digariskan.

Berikut ialah CSS yang dikemas kini:

a {
  text-decoration: underline;
}

a #myspan {
  color: black;
  display: inline-block;
}

a:active #myspan {
  color: grey;
}

a:visited #myspan {
  color: yellow;
}

a:hover #myspan {
  color: red;
}
Salin selepas log masuk

Anda juga boleh merujuk kepada kod HTML berikut:

<a href="#">A link <span>
Salin selepas log masuk

Dengan membuat perubahan ini, elemen #myspan tidak lagi akan terjejas oleh garis bawah yang digunakan pada pautan, membolehkan anda menggayakannya secara bebas tanpa menjejaskan penampilan keseluruhan pautan.

Atas ialah kandungan terperinci Bagaimana untuk Menggayakan Pautan tanpa Menggariskan Elemen Span Tertentu?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan