HTML 요소(Element)의 구조

HTML 요소(Element)의 구조

Opening tag

• 요소의 이름과(이 경우 p), 열고 닫는 꺽쇠 괄호로 구성됩니다. 요소가 시작(이 경우 단락의 시작 부분)부터 효과가 적용되기 시작

Closing tag

• 요소의 이름 앞에 슬래시(/)가 있는것을 제외하면 여는 태그(opening tag)와 같다.
• 요소의 끝(이 경우 단락의 끝 부분)에 위치함
• 닫는 태그를 적어주지 않는 경우 원하는 결과를 얻지 못할 수 있음

Content

• 요소의 내용이며, 이 경우 단순한 텍스트임

Element

• 여는 태그, 닫는 태그, 내용을 통틀어 요소(element)라고 함

포함(내포:內包)된 요소(Nesting elements)

요소 안에 다른 요소가 들어갈 수 있다.

• 그런 요소는 내포되었다고 표현

<p>My cat is <strong>very</strong> grumpy.</p>

• "고양이가 매우 사납다" 라는 문단을 강조하기 위해, '매우'라는 단어를 강조하는 요소를 중첩해서 사용
• p 요소가 먼저 열렸고, 그리고 strong 요소가 열림
• 그렇기 때문에 strong 요소가 먼저 닫힌 후에 p 요소가 닫혀야 함

---

해당 자료는 MDN Web Doc을 기초로 작성되었습니다.