Bagaimana untuk Mencipta Pautan Boleh Diklik untuk Keseluruhan Div HTML yang Mengandungi Imej?

Cara 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

`

<br><a href="https://www.php.cn/link/2ca1ce4a65bf5b60c60bd7c4a89a33f9" rel="nofollow" target="_blank"><pre class="brush:php;toolbar:false"><span style="display: inline-block; height: 235px; width: 184px; border: 2px solid black; text-align: center;">
    <img  src="/static/imghwm/default1.png" data-src="myimage.jpg" class="lazy"    style="max-width:90%"  style="max-width:90%" alt="Bagaimana untuk Mencipta Pautan Boleh Diklik untuk Keseluruhan Div HTML yang Mengandungi Imej?" >
</span>

`

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

`

<br><div id="parentdivimage" style="cursor: pointer;" onclick="window.location='https://www.php.cn/link/2ca1ce4a65bf5b60c60bd7c4a89a33f9';">
<pre class="brush:php;toolbar:false"><div id="childdivimage" style="position: absolute; top: 50%; height: 62px; margin-top: -31px;">
    <img  src="/static/imghwm/default1.png" data-src="myimage.jpg" class="lazy"    style="max-width:90%"  style="max-width:90%" alt="Bagaimana untuk Mencipta Pautan Boleh Diklik untuk Keseluruhan Div HTML yang Mengandungi Imej?" >
</div>