| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | |||
| 5 | 6 | 7 | 8 | 9 | 10 | 11 |
| 12 | 13 | 14 | 15 | 16 | 17 | 18 |
| 19 | 20 | 21 | 22 | 23 | 24 | 25 |
| 26 | 27 | 28 | 29 | 30 | 31 |
- JAVA 개발 환경 설정
- colspan
- option
- tag
- Border
- BODY
- select
- textarea
- Ol
- !doctype html
- HTML정의
- img
- :active
- 속성 선택자
- ul
- ::before
- Head
- Li
- 전체 선택자
- table
- JavaScript
- ::first-line
- Form
- Python
- Title
- 한정수 강사님
- 인라인 레벨 요소
- rowspan
- BR
- ::first-letter
- Today
- Total
개발 공부 기록하기
DAY 1. HTML의 구조 본문
HTML의 구조
- <!DOCTYPE html> : 현재 문서가 HTML5 규칙을 따른 웹 문서임. ㅇㅇ..
- <html> ~ </html> : 웹 문서의 시작&끝. web browser는 이 안의 code를 읽어서 화면에 표시함.
- <head> ~ </head> : web browser가 웹 문서를 해석할 때 필요한 정보
- <body> ~ </body> : 실제로 web browser가 화면에 띄워주는 내용
※ 영어 대문자, 소문자 구분 안 해도 됨. 강조하고 싶을 때 대문자 씀.
<html lang="ko">
html tag에서 사용 언어를 표시하는 이유는 무엇이냐!
→ 검색 사이트에서 특정 언어로 제한해서 검색할 때 필요함.
→ screen reader(화면 낭독기)로 웹 문서를 소리 내서 읽어줄 때 발음, 억양, 목소리를 다르게 할 수 있음.
(이거.... 필요해....?)
<head>의 하위 tag - 자주 쓰는 <meta>와 <title>
meta information: data에 관한 data (뭔 말이여.....)
ex, 책의 meta information에는 책 가격, 쪽수, 저자 등이 있음. (아하!)
그래서,
<meta>
▲ 이 tag는 web browser에서 보이지 않지만, 웹문서와 관련된 정보를 지정할 때 쓴다.
(젤 중요한 역할: 화면에 글자를 표시할 때 어떤 인코딩을 사용할지 지정)
cf, 인코딩(encoding): 컴퓨터로 영상, 이미지 또는 소리 데이터를 생성할 때, 원래 data양을 줄이기 위해 data를 코드화하고 압축하는 것.
보통 web server는 영어가 default language라서, 화면에 한글 내용을 표시하면 깨질 수 있다.
<meta charset="UTF-8">
을 꼭 적어줄 것!
<title>
▲ 얘는 문서 제목을 나타내는 tag다.
<body>
실제 web browser에 표시할 내용을 이 tag 안에 쓴다!
근데 말이야... 바로 위 그림에서 제목 아래에 줄 긋는 건 어떤 tag로 한 거야??
code에 없는 것 같은뎅.. 내가 몰라서 못 알아보는 건가?
'프밍 > HTML' 카테고리의 다른 글
| DAY 2 - 웹 문서 구조를 만드는 시맨틱(Semantic) tag (0) | 2022.08.20 |
|---|---|
| DAY 2. HTML 파일 만들기 실습 (0) | 2022.08.20 |
| DAY 1. HTML이란? (0) | 2022.08.19 |
| DAY 1. 웹 브라우저 & 웹 에디터 (0) | 2022.08.19 |
| DAY 1. 웹 개발, 어디서부터 시작할까 (0) | 2022.08.19 |