본문 바로가기

생활정보

초보프로그래밍 HTML문서의 기본구조

728x90
728x90

HTML 문서의 기본구조는

<html>로 시작해서 </html>로 끝납니다.

 

- 문서의 기본구조 -

<html>

 

<head>               <-------- <head>안에 웹페이지의 정보를 저장할 수 있습니다.

<title>초보 프로그래밍</title>      <-------- <title> </title>안의 글자는 브라우저 윈도우 제목으로 표시됩니다.

</head>               <-------- </head>로 닫아줍니다.

 

<body>      <------- 웹페이지의 모든 내용이 <body> </body>안에 넣어진 내용으로 표시됩니다.

<p>초보 프로그래밍 HTML문서의 기본구조</p>

</body>

 

</html>

 

HTML 문서는 위와 같이 기본 구성되어 있습니다.

 

이 HTML 문서를 보면 <head> 처럼 < > 이런 괄호 표시가 글자를 둘러싸고 있는데 이것을 태그(tag)라고

합니다. 이 태그라는것은 문서의 구조와 스타일을 나타내는 단어로 시작 태그와 종료 태그가 있습니다.

시작 태그는 <head>이고 종료 태그는 </head> 입니다.

 

HTML 문서를 작성할때 참고사항

- 태그는 대소문자를 구분하지 않습니다. 즉 <head>와 <HEAD>는 같은 의미입니다.

- 시작 태그와 종료 태그 사이의 연속된 공백은 하나의 공백으로 취급됩니다.

 

HTML 요소는 속성(attribute)을 가질 수 있습니다.

하이퍼링크를 연결하는 요소를 보면

 

<a href="http://www.daum.net">다음으로 연결</a>

하이퍼링크는 <a> 태그로 정의되어 링크주소는 href라는 속성에 기술됩니다.

위 문장에서 "다음으로 연결"을 클릭하면 "http://www.daum.net" 사이트로

연결된다는 의미입니다.

 

HTML 문서 주석을 작성할 수 있습니다.

주석(comment)은 HTML 문서안에 코드나 태그를 설명하는 글을 표시할 수 있습니다.

즉 주석은 인터넷 브라우저에 의해 무시되고 표시는 되지를 않습니다.

주석은 다음과 같이 작성 됩니다.

 

<!-- 여기가 주석입니다. -->

<!--           -->   이 안에 글을 쓰면 무시되서 브라우저에는 보이지 않습니다.

 

인터넷에서 웹 페이지들을 보다가 이 페이지들이 어떻게 만들어졌는지 확인하시려면

크롬 브라우저의 경우 우측상단 크롬설정및 제어에서 - 도구 더보기 - 개발자 도구를

클릭하시면 소스를 보실 수 있습니다.

 


GOODMAN BLOG

728x90
728x90