2장. HTML5 문서 기본 이해하기
HTML (HyperText Markup Language)
- 웹을 위한 하이퍼텍스트 문서 작성 언어
- 웹 브라우저에서 보여지는 문서의 내부형식을 규정
- *.htm, *.html
2.1 문서 기본구조
<DOCTYPE html> : HTML5 문서 규약으로 만들어진 웹 문서 표시
<html> : 현재 파일이 html 문서라는 지시사항을 나타낸 태그
<head> : html 문서에 대한 일반적인 정보를 표시하는 머리말 역할의 태그(화면 출력x)
<title>제목</title> : 문서 제목 표기 태그
<meta charset="utf-8"> : 웹 문서에서 사용하고 있는 문자
</head>
</html>
- 요소(Element)
: HTML 문서 일부분의 특징을 지정하는 개별적 부분
단독태그 / 복합태그
- 속성(Attribute)
: 요소에 추가 정보를 주기 위해 사용
- 특수문자
<!-주석-->
공백
< <
> >
" "
& &
© 카피라이트
2.2 문서 꾸미기
2.2.1 단락 제목과 줄
- 제목(Headline) <hn> : n=1(큰)~6(작은)
- 단락(Paragraph) <p> : 줄을 바꾸면서 동시에 한 줄 띄게 됨 (한줄 여백 생김)
(+) align=”left, center, right” 등의 속성
- 줄바꿈(Line Break) <br>
- 가로줄(Horizontal Line) <hr>
2.2.2 단락 꾸미기
- 작성된 형식 유지 <pre> : 화면 입력 상태 그대로! (공백문자: 빈칸, 탭, 줄바꿈 등)
- 단락 인용 <blockquote> : 다른 글의 내용을 단락 단위로 인용해 포함시킬 때! 들여쓰기로 구분
2.2.3 다양한 텍스트 꾸미기
- <em> : 텍스트 강조 (기울여)
- <strong> : 강한 강조 (진하게)
- <small> : 작은 글자로
- <mark> : 하이라이트 효과 (형광펜)
- <sub>, <sup> : 아래첨자, 위첨자
@ HTML5 비권장(deprecated) 요소
-요소로는 가급적 문서 구조나 의미가 있는 특성을 표현 (출력 모양은 스타일시트 사용 권장)
-텍스트의 모양 관련 요소
- <font>, <center>, <u>, <b>, <i>, <blink>
2.3 목록 나열하기
- 순서 없는 목록 <ul>
- 순서 있는 목록 <ol>
ㄴ 나열된 항목(list item)은 둘다 <li>
- 정의 목록 <dl>
ㄴ 용어(term)은 <dt>, 설명(description)은 <dd>
'Web > HTML+CSS+JS' 카테고리의 다른 글
웹프로그래밍첫걸음 5장. 폼 활용하기 (0) | 2023.05.01 |
---|---|
웹프로그래밍첫걸음 4장. 링크와 멀티미디어 표현하기 (0) | 2023.05.01 |
웹프로그래밍첫걸음 3장. 문서 구조 표현하기 (0) | 2023.05.01 |
[자바스크립트의 시작] Javascript 제어문 (0) | 2023.03.29 |
[자바스크립트의 시작] 웹과 Javascript (0) | 2023.03.27 |