masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Mencipta Hiperpautan daripada Seluruh Sel Jadual Tanpa JavaScript?

Bagaimanakah Saya Boleh Mencipta Hiperpautan daripada Seluruh Sel Jadual Tanpa JavaScript?

DDD
Lepaskan： 2024-11-08 12:26:01
asal
652 orang telah melayarinya

How Can I Create a Hyperlink from an Entire Table Cell Without JavaScript?

Mencipta Hiperpautan daripada Sel Jadual

Tugasnya ialah mengubah penanda HTML berikut menjadi hiperpautan berfungsi:

<td>
  some text
  <div>a div</div>
</td>
Salin selepas log masuk

Matlamatnya ialah untuk menukar keseluruhan sel data jadual () kepada pautan boleh klik tanpa menggunakan JavaScript.

Kaedah Pilihan: Pendekatan berasaskan CSS

Semasa memautkan keseluruhan elemen tidak betul dari segi semantik, penyelesaian wujud. Dengan memanjangkan kandungan dalam ke tepinya, kita boleh mencipta kawasan pautan maya.

<td>
  <a href="http://example.com">
    <div>
Salin selepas log masuk

Pendekatan ini menggunakan

yang menduduki keseluruhan sel, membolehkan elemen meluas ke sempadan sel dengan berkesan.

Pendekatan Alternatif (Tidak Dinasihatkan)

Untuk persekitaran yang menyokong Internet Explorer secara eksklusif , kaedah bukan standard boleh digunakan, walaupun ia melanggar konvensyen HTML:

<table>
    <tr>
        <a href="http://example.com"><td  width="200">hello world</td></a>
    </tr>
</table>
Salin selepas log masuk

Walaupun pendekatan ini akan berfungsi sebagai pautan dalam Internet Explorer, pendekatan ini akan diabaikan dan dijadikan sebagai sel jadual standard dalam semua pelayar lain.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencipta Hiperpautan daripada Seluruh Sel Jadual Tanpa JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn
Artikel sebelumnya：Bolehkah CSS3 Digunakan untuk Menyesuaikan Warna Latar Belakang? Artikel seterusnya：Bagaimanakah saya boleh menggunakan Flexbox untuk mencipta DIV yang mengisi ruang antara pengepala dan pengaki?
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
Artikel terbaru oleh pengarang
Isu terkini
function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...
daripada 2024-04-29 11:01:01
0
3
2069
Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?
daripada 2024-04-23 00:22:19
0
11
2234
Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.
daripada 2024-04-19 15:37:47
0
1
1877
Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...
daripada 2024-04-18 23:52:34
0
1
1761
Di manakah perisian kursus tentang pemetaan minda CSS? Perisian kursus
daripada 2024-04-16 10:10:18
0
0
1790
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan