과제

HTML 문서 작성 연습

ilsancityboy 2023. 9. 6. 17:27

지난 글에서 HTML , JS , CSS 에 대해서 간단하게 알아보았다. 

이번 글에서는 HTML 문서를 간단하게 작성해보고 대략적인 구조를 알아볼 것이다.

 

HMTL 문서의 기본적인 구성이다.

<!DOCTYPE html>
<html>
<head>
    <title>웹 페이지 제목</title>
</head>
<body>
    <h1>제목1</h1>
    <p>이것은 단락입니다.</p>
</body>
</html>

 

<!DOCTYPE html> : html5 문서임을 정의한다. ( html5 - html 의 다섯번째 버전으로 최신버전) 

<html> - HTML 문서의 시작과 끝을 알린다. 모든 HTML 요소는 <html> 태그 안에 있어야한다. 

<head> - 문서의 정보를 입력하는 공간이다. 웹 페이지 제목, 스타일시트, 스크립트 등을 여기에 추가한다.

<title> - 웹 페이지의 제목을 정의하는 공간

<body> - 실제 컨텐츠가 들어가는 공간이다. 텍스트, 이미지, 링크 등을 여기에 추가한다.

<h1> - 제목을 정의하는 공간이다. h1부터 h6까지 숫자로 제목의 중요도를 표시한다.

<p> - 단락을 정의하는 공간이다.  텍스트 단락을 만들 때 사용한다.

 

보면 눈치 채겠지만 모든 태그는 시작 태그로 열어주고 다시 태그를 작성해 해당 공간을 닫아주는 개념으로 닫아주어야한다.

 

 

 

알아본 기본 html 구조를 작성하고 티스토리 내에 HTML블럭을 사용해 해당 문서를 작성해서 써보았다.

<!DOCTYPE html>
<html>
<head>
	<title>연습 페이지</title>
</head>
<body>
	<h1>제목입니다.</h1>
    <p> 안녕하세요 연습중입니다. </p>
</body>
</html>

 

 


연습 페이지

제목입니다.

안녕하세요 연습중입니다.