티스토리 뷰

HTML 엘리먼트

pilot376 2014. 7. 24. 23:53

HTML 엘리먼트

시작 태그(여는 태그)에서 종료 태그(닫는 태그)까지의 모든 것을 HTML 엘리먼트라고 한다.

시작 태그 엘리먼트 컨텐츠 종료 태그
<p> paragraph </p> 
<a href="target.html"> link </a>
<br>


HTML 엘리먼트 문법

  • HTML 엘리먼트는 시작 태그/여는 태그로 시작한다.
  • HTML 엘리먼트는 종료 태그/닫는 태그로 끝낸다.
  • 시작 태그와 종료 태그 사이에 위치하는 것들은 엘리먼트 컨텐츠(element content)라고 한다.
  • 일부 HTML 엘리먼트는 빈 컨텐츠를 가진다.
  • 빈 엘리먼트는 시작 태그만으로 닫는다.
  • 대부분의 HTML 엘리먼트는 어트리뷰트를 가질 수 있다.


중첩된 HTML 엘리먼트

대부분의 HTML 엘리먼트는 중첩될 수(다른 엘리먼트에 포함할 수) 있다.

HTML 문서는 중첩된 HTML 엘리먼트로 구성되어 있다.


HTML 문서 예제

<!DOCTYPE html> 
<html> 
    <body> 
        <p>paragraph.</p> 
    </body> 
</html>

위의 예는 3개의 HTML 엘리먼트를 포함하고 있다.


<p> 엘리먼트

<p>paragraph.</p>
  • <p> 엘리먼트는 HTML 문서 내에서 문장을 정의한다.
  • 엘리먼트는 시작 태그 <p>와 종료 태그 </p>를 가진다.
  • 엘리먼트 컨텐츠는 "paragraph."이다.

<body> 엘리먼트

<body> 
    <p>paragraph.</p> 
</body>
  • <body> 엘리먼트는 HTML 문서의 본문을 정의한다.
  • 엘리먼트는 시작 태그 <body>와 종료 태그 </body>를 가진다.
  • 엘리먼트 컨텐츠는 다른 HTML 엘리먼트이다. (p 엘리먼트)

<html> 엘리먼트

<html> 
    <body> 
        <p>paragraph.</p> 
    </body> 
</html>
  • <html> 엘리먼트는 전체 HTML 문서를 정의합니다.
  • 엘리먼트는 시작 태그 <html>과 종료 태그 </html>을 가진다.
  • 엘리먼트 컨텐츠는 다른 HTML 엘리먼트이다. (body 엘리먼트)


종료 태그를 잊지 말자

<p>This is a paragraph

만약 종료 태그를 빠뜨린다면, 많은 HTML 엘리먼트는 예상치 못한 결과 또는 오류를 만들어 낼 것이다.



빈 HTML 엘리먼트

내용이 없는 HTML 엘리먼트는 빈 엘리먼트라고 한다. <br> 은 종료 태그가 없는 빈 엘리먼트이다. (<br> 태그는 줄 바꿈을 위해 정의되었다.) 하지만 XHTML에서 모든 태그는 반드시 닫혀야 한다. XHTML에서는 "<br />"과 같이 시작 태그 안에 슬래시를 추가하여 닫는 것이 적절한 방법이다.

댓글