728x90
반응형
- HTML(Hyper Text Markup Language) : 정보 또는 설계도(특정구역을 설정)
<열린태그 속성 = "속성값"> 컨텐츠 </닫힌태그>
- <!DOCTYPE html>
HTML5라는 신조어로 문서를 선언하는 태그
- <head>....</head>
웹사이트의 간단한 요약 정보 (웹사이트에서 노출되지 않는 정보)
- <body>.... </body>
이미지, 텍스트 (웹사이트에서 눈에 보이는 정보)
- <meta charset='UTF-8'>
character setting의 약자를 나타내는 문자 코드
- <title>....</title>
웹사이트 탭에 나타나는 제목
- <a href = "https://www.naver.com" target = "_blank"> 네이버 </a>
- <a>...</a> : 다른 사이트로 이동
- href : 속성 페이지의 주소지정
- target : 어떤 방식으로 이동할지 결정 ("_blank ": 새탭 , "_self ": 현재탭)
- <img src = "logo.png" alt = "회사로고">
- alt 속성 : 웹사이트가 이미지 출력하지 못했을 경우 텍스트 정보로 대체
- <h1> Hello world </h1>
- h_ : heading의 약자로 숫자값이 클수록 폰트사이즈가 작음 (h1은 한번만 사용)
- <p> Hello world </p>
- 본문 내용을 표현
- <ol> .... </ol>
- 안에 <li> 태그하면 1. 2.3. 표현됨
- <ul> .... </ul>
- 안에 <li> 태그하면 순서없이 점으로 표현된 리스트 생성
구조를 잡을때 사용하는 태그
<목차>
- <header> : 머리글
- <nav> : 메뉴버튼
<본문>
- <main role = "main"> : 문서의 주요 내용을 담는 태그 (role="main" IE(internet explorer 지원))
- <article> : 문서의 주요 이미지나 텍스트 정보 담고 구역 설정 (태그내에 <h> 태그 존재해야함)
<부록>
- <footer> : 가장 하단 영역
- <div> : 임의의 공간
HTML 태그의 두 가지 성격
<Block 요소>
- <p> : 'y'축 정렬 형태로 출력(줄바꿈 현상 나타남, 공간을 점유함, 상하 배치 작업 가능)
<Inline 요소>
- <a> : 'x'축 정렬 형태로 출력(한줄에 출력, 상하 배치 작업 불가능)
728x90
반응형