HTML에서 이미지에 대한 링크를 추가하는 방법

이미 링크를 추가하는 방법이 궁금하십니까?
HTML 이미지 태그 ??

굉장합니다. 시작하겠습니다 🔥

다음 예는 <img> 태그에 이미지를 표시하기 위해 수행하는 일반적인 작업입니다.

<img src="https://www.thecoderpedia.com/wp-content/uploads/2020/06/Programming-Memes-Programmer-while-sleeping.jpg" 
     alt="cannot sleep">

위의 이미지를 클릭하면 이미지 링크가 열리지 않고 확대됩니다. 이것은 예상 결과입니다 😅.

그러나 이미지에 링크를 추가하는 방법 ??

쉬운 완두콩 😉

이 예제는 이전 예제를 기반으로 이미지를 링크로 변환하는 방법을 보여줍니다. 이렇게 하려면 <img> 안에 <a> 태그를 중첩합니다.
대신 텍스트 링크를 사용하는 것처럼 링크가 가리키는 리소스를 설명하는 대체 텍스트를 만들어야 합니다.

<a href="https://www.thecoderpedia.com/blog/programming-memes/">
  <img src="https://www.thecoderpedia.com/wp-content/uploads/2020/06/Programming-Memes-Programmer-while-sleeping.jpg"
       alt="Visit Meme site">
</a>

위 이미지를 클릭하시면 출처 링크로 이동합니다.

끝 ;p


자원;
MDN