HTML #4 문서타입, head, body

웹 서버/웹 기초 (HTML, CSS)

HTML #4 문서타입, head, body

코다람쥐 2022. 4. 21. 19:11

1. 문서타입

대부분의 웹사이트에서 F12를 눌러보면 맨 위에 <!DOCTYPE html>이라는 것이 있다.

DOC는 Document의 약자이고 DOCTYPE은 문서 타입이라는 뜻이다.

그리고 DOCTYPE html은 결국 html타입의 문서라는 표시이다.

모든 타입의 html문서는 <!DOCTYPE html>이 반드시 포함되어있어야 한다.

2. <html>

<html> ... </html>로 html타입의 문서라는 것을 표시할 수 있다.

<!DOCTYPE html>
<html>
Hello <u><b>Web</b></u> !
</html>

3. head

<head>영역에는 제목 느낌의 데이터가 들어가고

<body>영역에는 내용들이 들어가는 영역이다.

그리고 <head>영역에는 <tilte>을 넣을 것을 권고한다.

<head>
  <title>Title of the document</title>
</head>

title은 웹 페이지안에는 뜨지 않고 화면 상단에 탭영역에 표시된다.

그리고 헤더에는

<title>뿐만 아니라

4. body

head 외 대부분의 내용은 body영역에 작성된다.

그 중에 body안에 자주 사용 되는 것이div라는 것이 있는데 div는 구역을 설정하는 것이다.

<!DOCTYPE html>
<html>
<head>
<style>
.myDiv {
  border: 5px outset red;
  background-color: lightblue;    
  text-align: center;
}
</style>
</head>
<body>

<h1>The div element</h1>

<div class="myDiv">
  <h2>This is a heading in a div element</h2>
  <p>This is some text in a div element.</p>
</div>

<p>This is some text outside the div element.</p>

</body>
</html>