HTML 작성 방법
- HTML (Hypertext Markup Language) : 웹 문서를 만들 때 사용하는 태그 중심의 언어
- HTML 작성 시 주의사항
- 대소문자를 구분하지 않는다. 일반적으로 소문자로 작성한다.
- 2칸 이상의 공백은 모두 1칸으로 취급한다.
- 줄바꿈을 위해서는 <br> 태그를 사용해야 한다.
- HTML 기본 구조
- <!DOCTYPE> : 현재 문서의 유형 정의
- <html> : HTML 문서의 root 요소 정의
- <head> : HTML 문서의 metadata 정의
- <title> : HTML 문서의 제목 정의, 웹 브라우저에서 페이지 제목으로 표시됨
- <body> : 웹 브라우저를 통해 화면에 보여지는 부분
<!-- 현재 문서는 HTML5임을 나타냄 -->
<!DOCTYPE html>
<!-- lang : 사용할 언어 -->
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Hello HTML</title>
</head>
<body>
안녕하세요.<br>
반갑습니다.
</body>
</html>
기본 태그
- <br> 태그 : 줄 바꿈
안녕하세요.<br>
반갑습니다.<br>
좋은 하루 되세요!
- <h> 태그 : 제목 (크고 굵은 글자)
<h1>봄</h1>
<h2>여름</h2>
<h3>가을</h3>
<h4>겨울</h4>
<h5>하늘</h5>
<h6>바다</h6>
- <p> 태그 : 단락을 나타냄
- align 속성 : 글자 정렬 지정, 기본값 왼쪽 정렬
<p align="center">가운데 정렬</p>
<p align="left">왼쪽 정렬</p>
<p align="right">오른쪽 정렬</p>
- <div> 태그 : 구역을 나타냄
<div align="center">가운데 정렬</div>
<div align="left">왼쪽 정렬</div>
<div align="right">오른쪽 정렬</div>
- 글자 서식 태그
<b>굵은 글씨</b><br>
<strong>굵은 글씨, 중요도 높음</strong><br>
<ins>밑줄</ins><br>
<del>취소선</del><br>
<i>이탤릭체</i><br>
<em>이탤릭체, 중요도 높음</em><br>
위첨자<sup>123</sup><br>
아래첨자<sub>123</sub>O<br>
<mark>하이라이팅</mark> 효과
- HTML 주석
<!-- HTML 주석입니다. -->
HTML 엔티티 코드
- 엔티티 코드(Entity Code) : HTML 문서에서 특수문자를 출력하는 경우 사용한다.
- : 공백
- < : <
- > : >
- & : &
- " : "
- ' : '
- © : ⓒ
- ™ : TM
- × : ×
- ÷ : ÷
공 백<br>
<괄호><br>
HTML & CSS<br>
"안녕하세요."<br>
'반갑습니다.'<br>
©카카오<br>
네이버™<br>
'Web > HTML5' 카테고리의 다른 글
| [HTML] 시맨틱 태그(Semantic Elements) (0) | 2021.08.02 |
|---|---|
| [HTML] 비디오 태그 <video>, 오디오 태그 <audio>, iframe 태그 (0) | 2021.07.28 |
| [HTML] 입력 양식 태그 <form> (0) | 2021.07.28 |
| [HTML] 목록 태그 <ul> <ol>, 표 태그 <table> (0) | 2021.07.28 |
| [HTML] 앵커 태그<a>, 이미지 태그<img>, 바디 태그<body> (0) | 2021.07.28 |