[HTML/개념] 개념 정리 02 - 목록, <a> 태그, 이미지, 주석

 * 본 포스팅은 udemy [The Web Developer 부트캠프 2022] 강의를 듣고 작성하였습니다.

 

목록

- 숫자로 된 목록 ordered list 과 순서 없이 점으로 된 목록 unordered list

- 두 태그 모두 중첩된 태그로 이루어져 있음

- 내부에 <li>, <script>, <template> 태그 사용 가능

- <li> 목록 내의 단일 아이템을 표시하는 태그

- <li> 안에는 다른 태그들을 넣을 수 있음. li 태그, b 태그 등

 

 

<a> 태그

- 하이퍼링크

- 다른 웹페이지나 현재 페이지의 다른 위치, 주소 등으로 연결

- 연결을 위해서는 href 속성이 필요함 => a 태그 안에 들어가야 함!

- 현재는 파일 프로토콜을 사용하고 있기 때문에 http를 넣어줘야 함

- 인라인 태그에 속함 => 새로운 줄에 만들어지지 않음

 

이미지 <img>

- 닫는 태그가 없음. 콘텐츠도 없음

- 사진 넣는 방법

1) html 과 같은 위치에 두는 방법 => 확장자와 파일명 신경 쓸 것

2) 온라인 이미지를 사용하는 방법 => url 사용

3) 폴더를 만들어서 넣어놓는 방법

- alt: 텍스트로 된 이미지 설명. 스크린 리더로 읽는 사람들을 위해 웹 접근성을 고려

 

 

주석

- 메모, 피드백, 리마인더용

 

 

💡 꿀팁

1. 복사하려는 줄을 복사하는 방향에 따라 shift + option + 방향키

2. 주석 지정/해제 단축키 cmd + /