HTML

HTML(Hyper Text Markup Language) 란, 웹 페이지를 구성하는 마크업 언어이다.
웹 페이지를 정해진 규칙대로 기술하게 도와준다.

HTML 태그

html 태그 : html 문서의 끝과 끝
head 태그 : 웹 페이지의 정보. 1번만 가능
body 태그 : 브라우저에 나오는 내용
title 태그 : 문서 제목
meta 태그 : 문자 인코딩 및 문서 키워드
div 태그 : 컨텐츠 묶는 단위 (줄 바꿈)
span 태그 : 컨텐츠 묶는 단위 (줄 바꿈 X)
a 태그 : 앵커.
script 태그 : 자바스크립트 코드
link 태그 : 외부 파일
img 태그 : 이미지 삽입
p 태그 : 단락
li 태그 : ul과 ol 안에서 나타내는 항목
ul 태그 : unordered list
ol 태그 : ordered list
style 태그 : 스타일 정보
br 태그 : 줄 바꿈
hn 태그 : 제목 (n에 1~6 들어감)
input 태그 : 입력받는 부분
form 태그 : form 생성
iframe 태그 : 외부 페이지
nav 태그 : 문서 링크
strong 태그 : 강조
footer 태그 : 맨 아래 쓰는 정보
header 태그 : 제목
button 태그 : 버튼
i 태그: 이탤릭 체
b 태그: 글씨를 진하게
aside 태그: 본문 이외의 내용

TABLE 태그
table 태그: 테이블 생성 태그
th 태그: 테이블 헤더 태그
tr 태그: 테이블 행 태그
td 태그: 테이블 열 태그

dd dd dd dd

CSS

CSS(Cascading Style Sheets)란, 웹 페이지를 꾸미는 역할을 한다.
HTML에서 작성한 마크업 언어가 어떻게, 어느 위치에 표현되는지를 지정하여 준다.

CSS 구성 요소

Page Layout

화면을 나누는 방법
1. 수직분할

• 콘텐츠를 가로로 배치

2. 수평분할

• 콘텐츠를 수직으로 배치

@ 레이아웃 초기화

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
}

Flex 를 이용하여 Layout 잡기

flex의 크기를 유연하게 줄이거나 늘려 레이아웃을 잡을 수 있다.