안녕하세요! "진로상담&진로 강연"하는 남자 "월횽(박진형)”입니다.
오늘은 11강 링크 태그 (Link Tag) 에 대해서 알아보는 시간을 만들게 되었습니다. 오늘 수업도 여러분에게 유익한 수업이 되었으면 좋겠습니다. 그럼 링크 태그에 대해서 알아보겠습니다.
링크 태그란?
링크 태그는 웹 페이지에서 다른 페이지로 연결할 수 있도록 하는 방법입니다. 주로 <a> 태그를 사용합니다. 링크 태그는 텍스트나 이미지를 다른 페이지에 연결할 수 있도록 합니다.
텍스트에 링크를 적용하는 방법
텍스트에 링크를 적용하려면 <a href="링크"> 태그를 사용하고, 그 사이에 링크를 설명할 수 있는 텍스트를 넣으면 됩니다. 예를 들어 <a href="http://jast.co.kr">자스트</a>는 "자스트" 텍스트에 자스트 공식 홈페이지로 이동하는 링크를 적용한 것입니다.
<a href="http://jast.co.kr">자스트</a>
이미지에 링크를 적용하는 방법
이미지에 링크를 적용하려면 먼저 이미지 태그 <img src="파일명.jpg" alt="설명" height="100" width="500">를 사용합니다. 그 다음에 <a href="링크"> 태그로 감싸서 이미지를 링크로 연결합니다.
예를 들어 <a href="http://jast.co.kr"><img src="이미지.jpg" alt="자스트" height="100" width="500"></a>는 이미지에 자스트 공식 홈페이지로 이동하는 링크를 적용한 것입니다.
<a href="http://jast.co.kr"><img src="이미지.jpg" alt="자스트" height="100" width="500"></a>
결과물
이렇게 텍스트와 이미지에 링크를 적용하는 방법을 배웠습니다. a 링크 태그를 기억해두세요. 복습을 통해 연습하면 더 효과적으로 사용할 수 있습니다.
'프로그래밍 > HTML' 카테고리의 다른 글
13강 - 인라인 엘리먼트 (Inline elements) (0) | 2019.03.07 |
---|---|
12강 - 블록 레벨 엘리먼트 (Block level Elements) (0) | 2019.03.06 |
10강 - 주석 태그 (Comment Tag) (0) | 2019.03.04 |
9강 - 리스트(list)를 나타내는 태그 (li, ul, ol tag) (0) | 2019.03.01 |
8강 - 이미지 태그 (img tag) (0) | 2019.02.28 |