html 이미지 링크 넣기
▣ html 이미지 링크 넣기
■ html에서 링크를 거는 방법을 알아보겠습니다. 글의 제목은 이미지에 링크 걸기이지만....먼저 글자에 일반 링크 거는 방법을 알아보구요. 이어서 이미지에 링크를 넣어보도록 하겠습니다. html에서 이미지 넣는 방법은 이 글에서 대충 설명하겠지만...좀 더 자세히 알고 싶으면 다음 글을 참고 하시구요.
http://kd3302.tistory.com/351 ◀ html 이미지 넣기
먼저 일반 링크 걸기 위해서는 <a href> 태그를 이용하는데요. 형식은 다음과 같습니다.
■ 위 형식대로 메모장에서 입력해보겠습니다.
■ <a href> 태그의 형식에 맞게 입력하고 네이버의 주소를 넣어 봤습니다. 인터넷 브라우저에서 실행해보겠습니다.
■ 이렇게 링크가 걸린 문장이 출력되구요. 링크를 클릭하면.....
■ 입력한 주소의 사이트로 이동하게 됩니다. 링크 태그는 이해 되셨죠. 다음으로 이미지에 링크를 걸어보겠습니다.
■ 테스트로 사용할 이미지를 하나 준비했습니다. 이 그림에 링크를 네이버로 이동하는 링크를 걸어보겠습니다.
■ 준비한 이미지 파일을 바탕화면에 저장했구요. 파일 형식은 JPG 입니다. 경로를 복사하고...메모장의 html에 경로를 입력하도록 하겠습니다.
이미지에 링크를 걸기 위해서는 일반 링크 태그 안에 이미지 경로를 넣어주면 되거든요. 직접 입력해 보겠습니다.
■ 앞에서 살펴본 일반 링크 태그 사이에 이미지의 경로를 넣어주면 됩니다. 브라우저에서 실행해보겠습니다.
■ 이 페이지에서 그림을 클릭하면 역시 네이버로 이동하게 됩니다. ^^
이렇게 이미지에 링크를 거는 방법은 일반 링크 태그 안에 이미지의 경로를 넣어주시면 됩니다. 혹시 이해가 좀 안 되시면 직접 해보시면 쉽게 이해가 될 거에요. 수고하셨습니다.