[HTML] 단일 태그, HTML 태그(이미지 태그, 하이퍼링크)

1. 단일 태그

- 빈 요소, void 요소(Empty Elements) 라고도 하며 여는 태그와 닫는 태그 사이가 없는 요소
- 주로 문서에 무언가를 첨부하기 위해 사용됨

2. 이미지 태그

• 웹 페이지에서 주로 사용되는 이미지의 종류
  
  • jpg(jpeg)
    - 휴대폰 사진, 카메라 사진, 배경 이미지 등
    - 가장 널리 쓰이는 이미지 포맷
    - 표현 색상(24비트, 약 1600만 색상)이 뛰어나 고해상도 표시장치에 적합
  • gif
    - 이미지 파일 내에 이미지 및 문자열 같은 정보를 저장할 수 있는 파일
    - 여러 장의 이미지를 한개의 파일에 저장할 수 있음(움짤, 애니메이션)
    - 8비트(256색상) 컬러만 지원
  • png
    - gif의 대체 포맷으로 개발
    - 8비트, 24비트 컬러 이미지 처리
    - w3c 권장 포맷
    - 알파 채널 지원(배경 투명하게 할 수 있음)
  • webp
    - 구글이 개발한 완벽한 이미지 포맷
• <img> 태그
  <img src="경로" alt="대체할 문자열">
  - alt 속성은 이미지를 제대로 표현하지 못할 때 대신 띄워줄 문자열
  
  • 상대 경로
    - 현재 위치한 페이지(파일) 기준으로 찾아가는 경로
    ./ : 현재 폴더(ex : "./beer.png" == "beer1.png")
    ../ : 상위 폴더로
  • 절대 경로
    - 어떤 페이지에 있던 간에 최상위 경로부터 하나씩 써 놓아서 찾아갈 수 있게 작성한 경로
    - 절대 경로에 드라이브 경로는 작성할 수 없음
    - 이미지의 주소를 사용하여 이미지를 넣을 수 있음

3. 하이퍼링크

- 다른 HTML 파일로 찾아갈 수 있도록 링크를 걸어줄 때 사용
- 현재 페이지에서 다른 페이지로 이동하고자 할 때 사용
- 보통 링크라고 부르며 <a>태그로 사용
<a href="이동할 페이지 경로" target="보여줄 창">문자열 또는 이미지</a>

- <style></style> : CSS를 채워 넣기 위한 태그