HTML : 이미지 삽입, 링크

이미지 삽입하기

<img src="경로" [속성='값']>

[ ] 안은 생략 가능

속성

- alt : 이미지에 대한 설명

- width, height 이미지 크기 조정하기

파일이 있는 경로를 알려줘야 화면에 이미지를 표시할 수 있다

경로를 표시하는 기호 '/' = 하위 폴더, '..' = 상위 폴더

​

<figure> - 웹 문서 안에서 표, 소스코드 등 한 단위가 되는 요소를 묶을 때 사용

<img>

<figcaption> 이미지 설명글 </figcaption>

<figure>

이미지에 설명글 붙이기

​

​

링크 만들기

<a

href 링크한 문서나 사이트의 주소를 입력

target 링크한 내용이 표시될 위치(현재 창 또는 새 창)를 지정

download 링크한 내용을 보여 주는 것이 아니라 다운로드

rel 현재 문서와 링크한 문서의 관계를 알려줌

hreflang 링크한 문서의 언어를 지정

type 링크한 문서의 파일 유형을 알려줌

> 텍스트

</a>

​

target 속성 ( a태그 안에 사용)

_blank 링크 내용이 새 창이나 새 탭에서 열림

_self 기본값으로 링크가 있는 화면에서 열림

_parent 프레임을 사용했을 때 링크 내용을 부모 프레임에 표시

_top 프레임을 사용했을 때 프레임에서 벗어나 링크 내용을 전체 화면에 표시

​

​

링크를 이용하여 페이지 내에서 특정 부분으로 이동하는 앵커(anchor) 만들기

ex) < a href="#menu"> 메뉴로 돌아가기 </a>

< h2 id="menu"> 메뉴 </h2>

첫 줄의 메뉴로 돌아가기를 클릭하면 메뉴가 적힌 곳으로 즉시 이동함

​