HTML/CSS에서 가변 이미지 크기로 클릭 가능한 Div를 만드는 방법은 무엇입니까?

HTML/CSS에서 전체 Div 하이퍼링크 만들기

문제:

전체 div에 대한 하이퍼링크 만들기(# parentdivimage)에 다양한 이미지 크기(모두 180x235 미만)가 있습니다. div에는 테두리가 있고 수직으로 정렬된 이미지가 있습니다.

해결책:

고려해야 할 세 가지 기본 옵션이 있습니다.

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에서 범위로 변경합니다.

위 내용은 HTML/CSS에서 가변 이미지 크기로 클릭 가능한 Div를 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!