HTML

하이퍼링크 삽입하기

컴맹숙 2022. 10. 24. 01:23

링크를 삽입하는 a 태그와 href 속성

링크는 a 태그로 만든다.

이 때 텍스트를 사용하면 텍스트 링크,

이미지를 사용하면 이미지 링크가 된다.

 

1. 텍스트 링크 만들기

a 태그 사이에 링크로 만들 텍스트를 입력하고

href 속성에는 연결할 문서의 경로와 파일명을 입력한다.

<a href="https://www.naver.com/">네이버로 이동하기</a>

텍스트 링크

'네이버로 이동하기'를 클릭하면 입력한 주소로 이동한다.  

 

 

2. 이미지 링크 만들기

a 태그 사이에 img 태그를 사용하여 이미지 링크를 만든다.

<a href="https://www.naver.com/"><img src="images/pig.jpg" alt="아기돼지"></a>

 

3. 링크를 새 탭에서 열어주는 target 속성

1, 2번 같은 방식으로 하이퍼링크를 삽입하면

현재의 웹 브라우저 창에서 연결된 문서로 바뀐다.

target 속성에 _blank를 지정하면 새 탭에서 연결된 문서가 열린다.

<a href="https://www.google.co.kr/" target="_blank">구글</a>

target 속성

 

더보기

Do it! HTML+CSS+자바스크립트 웹 표준의 정석 교재를 참고하여 작성했다.

'HTML' 카테고리의 다른 글

사용자 입력을 위한 input 태그 (1)  (0) 2022.10.26
폼 삽입하기  (0) 2022.10.26
오디오, 비디오 삽입하기  (0) 2022.10.24
이미지 삽입하기  (0) 2022.10.23
표 만들기  (0) 2022.10.23