Bagaimana untuk Membuat Pautan Sel Jadual Menjangkau Keseluruhan Ketinggian Baris?

Meluaskan Pautan Sel Jadual untuk Mengisi Ketinggian Baris

Apabila mencipta jadual dengan sel yang mengandungi pautan, adalah wajar untuk membolehkan pengguna mengklik di mana-mana sahaja dalam sel dan mencetuskan tindakan pautan. Walau bagaimanapun, apabila sel menjangkau berbilang baris manakala yang lain dalam baris yang sama mempunyai lebih sedikit baris, sel yang lebih pendek mungkin tidak memenuhi keseluruhan ruang menegak baris tersebut.

Untuk menangani isu ini, pendekatan biasa adalah dengan menetapkan pautan elemen dalam sel untuk bertindak sebagai elemen blok menggunakan paparan: sifat blok. Ini membolehkan pautan berkembang kepada lebar dan ketinggian penuh sel. Walau bagaimanapun, dalam kes di mana sesetengah sel mempunyai berbilang baris, sel satu baris masih boleh kelihatan lebih pendek secara visual.

Penyelesaian kepada masalah ini ialah dengan menggunakan margin negatif dan padding yang sama pada elemen blok. Jidar negatif memastikan elemen blok mengembang melepasi sempadan sel, manakala pelapik menghalang teks daripada bertindih kandungan sel. Selain itu, menetapkan sifat limpahan sel jadual induk kepada tersembunyi menghalang limpahan kandungan di luar sempadan sel.

Pertimbangkan kod CSS yang dikemas kini berikut:

td {
    overflow: hidden;
}
td a {
    display: block;
    margin: -10em;
    padding: 10em;
}

Dengan pelarasan ini, pautan dalam sel jadual akan meregangkan untuk mengisi keseluruhan ketinggian baris, memastikan penampilan yang konsisten untuk semua sel, tanpa mengira panjang kandungannya.

Atas ialah kandungan terperinci Bagaimana untuk Membuat Pautan Sel Jadual Menjangkau Keseluruhan Ketinggian Baris?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!