01 . 블록, 인라인
1. 블록 요소 (레이아웃을 잡는용도) 2. 인라인 요소 ( TEXT로 쓰는 용도 )
- DIV,H1,P - SAPN, IMG
- 사용 가능한 최대 가로 너비를 사용 - 필요한 만큼의 너비만 사용
- 크기를 지정할 수 있다.(가로, 세로 지정) - 크기를 지정할 수 없다.
- width : 100%; height : 0; 으로 시작 - width : 0 height : 0 로 시작
- 수직으로 쌓임 - 수평으로 쌓임
- margin, padding 위, 아래, 좌, 우 사용가능 - margin, padding 위, 아래는 사용불가
인라인, 블록 요소는 display 속성으로 정의 되어있음 .
02 . 주요범위 & 메타데이터 - HTML, HEAD, BODY, TITLE
<!DOCTYPE html > -> html5의 버전으로 해석을해서 브라우저에 출력을 하겠다.
HTML 태그 ( 웹의 시작과 끝을 정의 )
HEAD 태그 ( 문서의 정보 )
- HTML 문서의 제목 <title>태그 (브라우저 탭)
- 기타 정보 <meta>태그 ( 문자가 인코딩 되는 방식 = charset ="UTF-8" )
- 스타일 직접 입력
- 스타일 외부에서 가져와서 연결
BODY 태그 ( 문서의 구조 )
03 . 메타데이터 - META
- 기타 정보 <meta>태그 ( 문자가 인코딩 되는 방식 = charset ="UTF-8" )
- content 속성 : 이 속성은 http-equiv 또는 name 속성 중 어떤 것이 사용되느냐에
따라 해당 속성의 값을 갖습니다.
- name 속성 : 이 속성은 문서 레벨의 메타데이터의 이름을 정의한다.
04 . 메타데이터 - LINK ( 현재 문서와 외부리소스(css)와의 관계를 명시한다 )
- 스타일 외부에서 가져와서 연결 < link rel="stylesheet" href = "" >
05 . 메타데이터 - STYLE
- 스타일을 직접 입력
ex ) <style> ( 바디 태그 안에 들어가도 문제는 없다. 하지만 효율적인 방법은 아님 )
div {
color : red;
}
06 . 메타데이터 - MIME Type
- MIME 타입이란 클라이언트에게 전송된 문서의 다양성을 알려주기 위한 메커니즘
- <style type="text/css">
07 . 메타데이터 - BASE
- BASE 요소는 문서에 포함된 모든 상대 URL 들의 기준 URL을 나타낸다.
BASE 경로는 모든 상대경로의 영향을 끼치므로 정확히 기준을 잡아서 사용을 해야된다.
'프론트엔드 > HTML' 카테고리의 다른 글
| 06. HTML / 요소 - 인라인 텍스트 & 수정 (0) | 2021.02.02 |
|---|---|
| 05. HTML / 요소 - 콘텐츠 구분 & 문자 콘텐츠 (0) | 2021.02.01 |
| 03. HTML & CSS 첫걸음 / CSS (0) | 2021.01.17 |
| 02. HTML & CSS 첫걸음 / HTML (0) | 2021.01.16 |
| 01. HTML & CSS 첫걸음 / 개요 (후기) (0) | 2021.01.13 |
댓글