[프론트엔드]혼자서 공부하기 day2: Html 기본

요소(element)

 

코딩에 관심이 있기도하고 블로그로 글을 쓰거나 뭔가 이런저런 상황에서

html을 본적이 많이 있었어서 <h1>내용</h1>같은 구조를 많이 보았었다. 

 

전 날에는 html을 이용하여 Hello world를 출력하였는데 

여기서도 <div>Hello world</div>와 같은 구조를 사용하였다 

 

이런것들을 요소라고 하며 간혹 태그=  요소와 동일하게 사용된다고 한다 

 

태그 간의 관계(부모- 자식)

 

이런 요소의 활용법들에는 다음과 같은 것들이 존재합니다 

들여쓰기를 통해서 특정 요소가 어떤 요소의 하위에 위치하게 되는데 이런것들을 부모 요소 / 자식 요소라고 합니다 

<div> 
	<div></div> 
</div>

 

요소가 복잡해지면 다음과 같이 표기하면 구분하기가 어렵기 때문에 들여쓰기를 해서 구분해줍니다 

파이썬에서와 같이 필수 요소는 아닌거 같습니다 

 

여간 가독성을 위해서 다음과 같이 구분해서 사용하는게 용이합니다 

 

 

빈 태그(Empty tag) 

빈 태그에는 html의 버전별로 차이가 있는데 

html 1/2/3/4d의 경우에는 빈 태그가 있어도 오류가 나지 않는 반면 

xml과 html5의 경우에는 /를 통해서 빈 태그라는 것을 명시해줘야 합니다 

-> 그렇기 때문에 가독성에서는 더 좋을거라고 생각합니다 

 

 

빈 태그의 속성, 값 

 

앞에서 사용하였던 meta, link 등의 태그는 빈 태그의 대표적인 예시였습니다

이러한 태그를 통해서 속성에 값을 할당해주고 html 기능을 확장할 수 있습니다