


Bagaimana untuk Mencipta Pautan Boleh Diklik untuk Keseluruhan Div HTML yang Mengandungi Imej?
Nov 01, 2024 am 12:37 AMCara Membuat Pautan Anchor untuk Keseluruhan Div HTML
Dalam HTML/CSS, mencipta pautan untuk keseluruhan elemen div boleh dicapai melalui pelbagai pendekatan. Keperluan yang dinyatakan dalam pertanyaan adalah untuk mencipta pautan untuk div yang mengandungi imej yang berpusat secara menegak dalam div induknya. Walaupun penyelesaian awal yang melibatkan div bersarang dan gaya sebaris mungkin kelihatan boleh dilaksanakan, ia bercanggah dengan piawaian pengekodan HTML yang sah.
Untuk menangani isu ini, terdapat berbilang pilihan yang tersedia:
1. Menggunakan Elemen Inline-block dalam Tag Anchor
<span style="display: inline-block; height: 235px; width: 184px; border: 2px solid black; text-align: center;"> <img src="myimage.jpg" height="62" width="180"> </span>
</pre>`
Kaedah ini memastikan bahawa imej kekal berpusat secara menegak dalam div induk, yang kini merupakan elemen blok sebaris yang disertakan dalam teg sauh.
2. Menggunakan JavaScript untuk Pengendalian Klik
`<pre>
<div id="parentdivimage" style="cursor: pointer;" onclick="window.location='https://www.php.cn/link/2ca1ce4a65bf5b60c60bd7c4a89a33f9';">
<div id="childdivimage" style="position: absolute; top: 50%; height: 62px; margin-top: -31px;"> <img src="myimage.jpg" height="62" width="180"> </div>
</div>
</pre> 🎜>
<div style="cursor: pointer;">
<a href="https://www.php.cn/link/2ca1ce4a65bf5b60c60bd7c4a89a33f9"> <div style="height: 235px; width: 184px; border: 2px solid black; text-align: center;"> <img src="myimage.jpg" height="62" width="180"> </div> </a>
</pre>`
Atas ialah kandungan terperinci Bagaimana untuk Mencipta Pautan Boleh Diklik untuk Keseluruhan Div HTML yang Mengandungi Imej?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Artikel Panas

Alat panas Tag

Artikel Panas

Tag artikel panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Menambah bayang -bayang kotak ke blok dan elemen WordPress

Buat borang hubungan JavaScript dengan rangka kerja pintar

Buat editor teks sebaris dengan atribut yang boleh dipertikaikan

Membandingkan 5 Pembina Borang PHP Terbaik (dan 3 skrip percuma)

Menjadikan Peralihan Svelte Khas pertama anda

Pembaca Skrin Demystifying: Borang & Amalan Terbaik Diakses

Muat naik fail dengan multer di node.js dan ekspres
