HTML 태그 구성요소
<열린태그 속성 = "속성값"> 컨텐츠 </닫힌태그>
HTML 문서의 기본구조
<!DOCTYPE HTML> ->html 5 문서 선언
<html> -> 문서의 시작과 끝
<head> -> 웹사이트의 간단한 요약정보
<meta charset="UTF-8"> -> 문자코드
<title>웹프로그래밍</title> -> 웹사이트 제목
</head>
<body> -> 웹사이트의 눈에 보이는 정보
</body>
</html>
<img>태그
<img src='logo.png' alt="회사로고">
<h>태그
<h1>Hello World</h1>
<h2>Hello World</h2>
heading 의 약자로 제목이나 부제목을 표현.
<h1>태그는 가장 중요한 정보를 담으므로, 하나의 html문서에서 한번만 사용됨.
<p>태그
Paragraph의 약자로 본문내용을 표현
웹사이트의 중요정보를 담는 태그
<ul>태그
<ul>
<li>메뉴1</li>
<li>메뉴2</li>
</ul>
Unordered list의 약자로 순서가 없는 리스트 생성
메뉴 버튼을 만들때 사용되는 태그
<ol>태그
<ol>
<li>메뉴1</li>
<li>메뉴2</li>
</ol>ordered list의 약자로 순서가 있는 리스트 생성
메뉴 버튼을 만들때 사용되는 태그
HTML 태그 구성 요소
목차
본문
부록
목차를 잡을 때 사용하는 태그
header : 웹사이트의 머리글
nav : 메뉴버튼 <ul>,<li>,<a>
<header>
<img src="https://source.unsplash.com/random" alt="My Image">
<nav>
<ul>
<li>홈</li>
<li>전체 목록</li>
</ul>
</nav>
</header>
본문을 잡을 떄 사용하는 태그
main : 문서의 본문 영역(IE는 지원하지 않으므로 role="main" 속성 필수 입력)
article : 주요 이미지나 텍스트 등의 정보를 담고 구역을 설정하는 태그
태그 내에 구역을 대표하는 타이틀 <h#>태크가 존재해야 함.
footer : 가장 하단에 들어가는 정보를 표기할 떄 사용
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>WEB</title>
</head>
<body>
<header>
</header>
<main role="main">
</main>
<footer>
</footer>
</body>
</html>
HTML 태그의 두가지 성격
Block 요소 Inline 요소
<!--Block 요소 -->
<p>Hello World</p>
<p>Hello World</p><!--Inline 요소 -->
<a>Hello World</a>
<a>Hello World</a>두 요소를 구분 짓는 세가지 주요 특징 : 줄바꿈 현상, 가로·세로. 상·하 배치
-Block 요소 : y축 정렬 형태로 출력(줄바꿈 현상)
h1~h6, header, div
width, height 설정 가능
-Inline 요소 : x축 정렬 형태로 출력(한줄에 출력)