HTML/CSS で可変の画像サイズを持つクリッカブル Div を作成するにはどうすればよいですか?

HTML/CSS での Div 全体のハイパーリンクの作成

問題:

完全な div のハイパーリンクの作成 (# parentdivimage) をさまざまな画像サイズ (すべて 180x235 未満) で作成します。 div には境界線と垂直方向に整列した画像があります。

解決策:

考慮すべき主なオプションは 3 つあります。

1.意味的に正しくありません (ただし機能的には):

<code class="html"><a href="http://google.com">
  <div>...</div>
</a></code>

このメソッドは技術的には機能しますが、HTML セマンティクスに違反します。

2.意味的に正しい (JS を使用):

<code class="html"><div style="cursor: pointer;" onclick="window.location='http://google.com';">...</div></code>

このメソッドは意味的に正しいですが、機能的に JavaScript に依存しています。

3.意味的に正しい (非 Div リンク):

<code class="html"><a href="http://google.com">
  <span style="display: block;">...</span>
</a></code>

このメソッドは意味的に正しく、機能しますが、ラッパー要素を div から span に変更します。

以上がHTML/CSS で可変の画像サイズを持つクリッカブル Div を作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。