절대경로 상대경로
- 절대 경로 : 네이버메인 페이지와 같이 변하지 않는 url를 뜻한다.
- 상대 경로 : 폴더의 위치와 같이 상대적으로 변할 수 있는 링크를 뜻한다.
a 태그
a 태그 : 지정된 경로로 이동하게 해주는 태그 / <a></a>
a 태그 사용법 : 텍스트 또는 이미지등을 a태그로 감싼 후 a 태그의 머리에 hret 태그를 넣어 경로를 지정해 준다.
경로가 아직 정해지지 않은 경우 비어두기 보다 “#”을 넣어 웹표준에 준하도록 한다.
ex) <a href=”#”>바로가기</a>
* href 태그는 메인 태그 안에 들어가는 속성 태그라고 부른다.
새탭으로 경로 열기 : a 태그를 클릭시 경로로 이동할때 기존 탭이 아닌 새로운 탭을 열어 경로를 이동시키기 위해서는 target 태그를 사용해준다. target 태그가 없을시 기존 탭에서 경로이동 하는 것이 기본값이다.
* href 태그와 같이 속성 태그라고 부른다.
ex) <a href=”#” target=”_blank”>바로가기</a>
절대경로 이동 : 우리가 흔히 알고 있는 url로 변하지 않는 값으로 이동을 뜻한다.
상대경로 이동 : 파일을 열거나 다운받는 경우 폴더의 위치 등을 상대결로 라고한다.
ex) <a href=”./../img_1.jpg” target=”_blank”>바로가기</a>
./ : 현재 작업하고 있는 파일의 위치를 의미한다
../ : 현재 위치에서 상위폴더로 이동하는 것을 의미한다. (뒤로가기)
img 태그
img 태그 : 이미지를 삽입하는 태그
ex) <img src=”./img/a.jpg” alt=”인물사진”>
src : img 태그 안에 들어간 속성 태그로 이미지의 위치를 작성하는 속성 태그 이다.
alt : img 태그 안에 들어간 속성 태그로 이미지를 찾을 수 없을때 어떤 이미지 였는지 설명해 주는 글을 지정해 줄 수 있다. 웹접근성을 위해 img 태그 안에 꼭 함께 들어가야 하는 태그이다.
figcaption : 이미지의 이름을 달아줄때 사용하는 태그이다.
figure : 태그 안에 속해있는 이미지의 테두리에 프레임을 만들어 주는 태그이다.
ex) <figure><figcaption><img src=”./img/a.jpg” alt=”인물사진”>인물사진</figcaption></figure>