HTML level.1

기본 문법

1. 태그(Tag)

<tag></tag>
<tag>CONTENT</tag>

태그는 열리고, 닫히는 구조를 가지고 있고 이는 한 쌍이다.
다시말해, 시작하고 종료되는 구조라고 볼 수 있다.
이러한 구조로 태그의 범위를 만들 수 있다.

2. 속성(Attributes)과 값(Value)

<tag 속성="값"></tag>

---예시---
<img src="./photo.jpg" alt="내 사진" />
<div class="name">Wanie</div>

태그(img, div)의 기능을 확장하기 위해서는 위 처럼
'속성'(src, alt, class)을 사용할 수 있으며,
각각의 태그(img, div)안에 적용할 수 있는 속성은 제각각 다르다.

3. 부모와 자식 요소

<parent> 
    <child>
    </child>
</parent>

---예시---
<div class="nav-bar">
	<h1>Wanie Space</h1>
    <ul>
    	<li>about</li>
        <li>like</li>
        <li>goal</li>
    </ul>
</div>

위의 구조에서 < div> 는 < h1 > 과 < ul > 의 부모 요소입니다.
또한 < ul >은 각각의 < li > 의 부모 요소입니다.

반대로 < h1 > 과 < ul > 은 < div >의 자식 요소이며,
또한 < li > 는 < ul > 의 자식 요소입니다.

이처럼 부모와 자식 요소는 상대적인 개념으로 조금 더 나아가
설명하자면 < div > 는 < li > 의 조상(상위) 요소,
반대로 < li > 는 < div > 의 후손(하위) 요소라고 할 수 있습니다.

4. 빈 태그

<tag> 	 <!-- /가 없는 빈태그 -->
------
<tag/>	 <!-- /가 있는 빈태그 -->

위의 태그처럼 HTML에서는 닫히는 개념이 없는 태그들이 있습니다.
자세한 내용은 다음 글들에서 추가적으로 설명하겠습니다.