본문 바로가기

HTML 요소(HTML Elements)

HTML Elements

An HTML element usually consists of a start tag and end tag, with the content inserted in between:

HTML 요소는 일반적으로 시작 태그종료 태그로 구성되며 그 사이에 내용이 삽입됩니다.

<tagname>Content goes here... </tagname>

The HTML element is everything from the start tag to the end tag:

HTML 요소 는 시작 태그에서 종료 태그까지의 모든 것입니다:

<p>My first paragraph. </p>

 Start tag

 Element content

 End tag

 <h1>

 My First Heading

 </h1>

 <p>

 My first paragraph.

 </p>

 <br>

 

 


HTML elements with no content are called empty elements. Empty elements do not have an end tag, such as the <br> element (which indicates a line break).

내용이없는 HTML 요소를 빈 요소라고합니다. 빈 요소에는 <br> 요소 (줄 바꿈을 나타냄)와 같은 끝 태그가 없습니다.



Nested HTML Elements

중첩 된 HTML 요소


HTML elements can be nested (elements can contain elements).

HTML 요소는 중첩 될 수 있습니다 (요소에는 요소가 포함될 수 있음).

All HTML documents consist of nested HTML elements.

모든 HTML 문서는 중첩 된 HTML 요소로 구성됩니다.

This example contains four HTML elements:

이 예제에는 4 개의 HTML 요소가 포함되어 있습니다.


Example

1
2
3
4
5
6
7
<!DOCTYPE html>
<html>
  <body>
    <h1>My First Heading</h1>
    <p>My first paragraph.</p>
  </body>
</html>
cs


Try it Yourself »

Example Explained

The <html> element defines the whole document.

<html>요소는 정의 전체 문서를 .

It has a start tag <html> and an end tag </html>

그것은 가지고 시작 태그 <HTML> 및 종료 태그 </ HTML>입니다.

The element content is another HTML element (the <body> element).

요소 내용 은 다른 HTML 요소 ( <body>요소)입니다.


1
2
3
4
5
6
<html>
  <body>
    <h1>My First Heading</h1>
    <p>My first paragraph.</p>
  </body>
</html>
cs


The <body> element defines the document body.

<body>요소는 정의 문서 본문을 .

It has a start tag <body> and an end tag </body>.

그것은 가지고 시작 태그 <body>종료 태그 </ body>입니다.

The element content is two other HTML elements (<h1> and <p>).

요소 내용 은 두 개의 다른 HTML 요소 ( <h1><p>)입니다.


1
2
3
4
<body>
  <h1>My First Heading</h1>
  <p>My first paragraph.</p>
</body>
cs


The <h1> element defines a heading.

<h1>요소는 정의 제목을 .

It has a start tag <h1> and an end tag </h1>.

그것은 가지고 시작 태그 <H1> 및 종료 태그 </ H1>입니다.

The element content is: My First Heading.

요소 내용 은 다음과 같습니다. My First Heading.


1
<h1>My First Heading</h1>
cs


The <p> element defines a paragraph.

<p>요소는 정의 단락을 .

It has a start tag <p> and an end tag </p>

그것은 가지고 시작 태그 <p> 및 엔드 </ p> 태그.

The element content is: My first paragraph.

요소 내용 은 다음과 같습니다. 첫 번째 단락.


1
<p>My first paragraph.</p>
cs



Do Not Forget the End Tag

끝 태그를 잊지 마라.


Some HTML elements will display correctly, even if you forget the end tag:

종료 태그를 잊어 버린 경우에도 일부 HTML 요소가 올바르게 표시됩니다.


Example


1
2
3
4
5
6
<html>
  <body>
    <p>This is a paragraph
    <p>This is a paragraph
  </body>
</html>
cs


Try it Yourself »


The example above works in all browsers, because the closing tag is considered optional.

위의 예제는 모든 브라우저에서 작동합니다. 왜냐하면 닫기 태그는 선택 사항으로 간주되기 때문입니다.

Never rely on this. It might produce unexpected results and/or errors if you forget the end tag.

이것을 절대 의지하지 마십시오. 종료 태그를 잊어 버리면 예기치 않은 결과 및 / 또는 오류가 발생할 수 있습니다.



Empty HTML Elements

빈 HTML 요소


HTML elements with no content are called empty elements.

내용이없는 HTML 요소를 빈 요소라고합니다.

<br> is an empty element without a closing tag (the <br> tag defines a line break).

<br>닫는 태그가없는 빈 요소입니다 (이 <br>태그는 줄 바꿈을 정의합니다).

Empty elements can be "closed" in the opening tag like this: <br />.

비어있는 요소는 다음과 같이 시작 태그에서 "닫을"수 있습니다. <br /> <br />

HTML5 does not require empty elements to be closed. 

HTML5에서는 빈 요소를 닫을 필요가 없습니다. 

But if you want stricter validation, or if you need to make your document readable by XML parsers, you must close all HTML elements properly.

그러나 보다 엄격한 유효성 검사를 원하거나 XML 파서로 문서를 읽을 수 있도록해야하는 경우 모든 HTML 요소를 올바르게 닫아야합니다.



Use Lowercase Tags

소문자 태그 사용


HTML tags are not case sensitive: <P> means the same as <p>.

HTML 태그는 대소 문자를 구분하지 않습니다. <P>는 <p>와 같습니다.

The HTML5 standard does not require lowercase tags, but W3C recommends lowercase in HTML, and demands lowercase for stricter document types like XHTML.

HTML5 표준은 소문자 태그를 필요로하지 않지만 W3C 는 HTML에서 소문자를 권장 하고 XHTML과 같이 더 엄격한 문서 유형의 경우 소문자를 요구 합니다.

At W3Schools we always use lowercase tags.

W3Schools에서는 항상 소문자 태그를 사용합니다.




출처 : W3School.com


반응형

'HTML' 카테고리의 다른 글

HTML 제목(HTML Headings)  (0) 2018.06.05
HTML 속성(HTML Attributes)  (0) 2018.06.04
HTML 기본(HTML Basic)  (0) 2018.06.02
HTML 편집기(HTML Editors)  (0) 2018.06.01
HTML 소개(HTML Introduction)  (0) 2018.05.31