728x90
[HTML/CSS] HTML 태그 모음
html의 대부분의 태그는 여는 태그와 닫는 태그가 있다.
<html>로 시작하면 닫는 </html>이 꼭 있어야 한다.
하지만 <br>과 같이 닫는 태그가 없는 태그도 있다.
잘 구분해서 쓰면 좋을 것 같다.
| 태그 | 기능 | 활용방법 or 비고 |
| <!DOCTYPE html> | 웹 문서의 유형을 html로 지정 | <html>태그 위(문서 최상단)에 씀 |
| <html> | 문서를 html로 시작한다는 선언 | <html lang=“ko”>라고 하면 언어를 한국어로 지정한다는 뜻 |
| <head> | 브라우저의 정보를 입력 | <meta>, <title>, <link> 등이 주로 이 부분에 들어감. |
| <meta> | 메타데이터 입력 | <meta charset=“UTF-8”>이라고 하면 문서 내에서 한글을 사용할 수 있음. |
| <title> | 문서 제목 | 브라우저 탭 상에 나타나는 제목 |
| <link> | 외부 문서 참조 | 다른 문서를 참조할 때 사용(CSS 파일 등) <link rel = “~~~”, href=“~~파일명~~”> 형식으로 씀. |
| <body> | 문서의 내용을 입력 | 페이지의 모든 태그들을 body 라인 내에 입력함. |
| <header> | 헤더 영역 | 문서 최상단 제목 라인 부분의 분할을 담당 |
| <main> | 메인 영역 | 문서의 주요 내용을 담는 태그 |
| <aside> | 사이드바 영역 | 보통 블로그의 광고 영역과 같은 부분이 이에 속함. |
| <footer> | 푸터 영역 | 맨 아래의 저작권, 회사명 등을 적는 칸의 내용 분할을 담당 |
| <nav> | 네비게이션 영역 | 문서 내 다른 위치 또는 다른 문서로 연결할 때 사용. |
| <article> | 독립적 콘텐츠의 영역 | 다른 형식으로 추출해서 제공할 수 있는 콘텐츠를 묶을 때 사용. section과 비슷함. |
| <section> | 콘텐츠의 영역 | 여러 콘텐츠를 하나로 묶을 때 사용 article보다 글의 특정 영역이 시작하고 끝나는 점을 묶을 때 사용. |
| <div> | 여러 소스 묶기 | float를 묶는 것에 자주 사용한다. article, section과 특성은 비슷하며, 더 원시적인 묶음 태그라고 볼 수 있다. |
| <h1>, <h2>, … | 제목 | 1, 2, 3, 4… 식으로, 숫자가 커질 수록 주어진 폰트의 크기 등이 다르다. |
| <p> | 단락 표시 | 글의 단락을 표시해준다. 여러 문단을 넣을 경우, <br>과 함께 활용하여 줄 나누기를 할 수 있다. |
| <br> | 엔터 | 닫기 태그가 없음. |
| <ol> | 순서 있는 목록 | 1, 2, 3 or a, b, c 등으로 표시되어 나온다. |
| <ul> | 순서 없는 목록 | 순서가 없다. |
| <li> | 하나의 세부 리스트 | <ol>, <ul> 내부에서 사용됨 |
| <dl> | 설명 목록 | <dt>, <dd> 태그만 안에 들어갈 수 있다. <dt>는 제목, <dd>는 설명을 나타낸다. |
| <table> | 표 | <tr>, <thead>, <tbody>, <tfoot> 등과 함께 활용됨. |
| <img> | 이미지 삽입 | <img src=“~~이미지 경로~~”>와 같이 씀. width, height를 정하지 않으면 원본 크기로 생성. |
| <a> | 하이퍼링크 | <a href = “www.~~~”>로 그 글 또는 제목 또는 이미지에 붙여서 외부 링크로 연결할 수 있다. |
728x90
'Web' 카테고리의 다른 글
| [HTML/CSS] github hosting (0) | 2022.06.16 |
|---|---|
| [HTML/CSS] 필수 CSS 선택자, CSS 속성 모음 (0) | 2022.06.15 |
| [HTML/CSS] HTML/CSS란? (0) | 2022.06.15 |
| [Java] this와 super (0) | 2022.06.15 |
| [Java] Overloading, Overriding (0) | 2022.06.15 |
댓글