#3 - HTML 기본 문법

 

가장 기본적인 HTML의 문법을 알아보자

 

 

---

 

HTML 기본 문법

기본 형태

<tag>내용</tag>

 

HTML 문법에서 대부분의 요소들은 시작 태그와 종료 태그로 작성되며 그 사이에 내용이 들어간다.

 

빈 태그

<tag/>
<tag>

 

종종 종료 태그가 없는 형태를 볼 수 있는데, 이는 빈 태그라고 지칭한다.

 

속성/값

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

 

태그를 활용도 있게 사용하기 위해 속성과 값을 사용한다.

 

 

 <img src="./img/logo.png" alt="로고">

 

위의 의미는 아래와 같다.

1. img : image를 삽입해라. (속성)
2. src : source의 경로는 "파일이 있는 위치 > img > logo.png"이다. (값)
3. alt : 이미지가 표시되지 않을 경우, "로고" 텍스트를 노출시켜라. 

 

부모/자식 요소

<Parent>
  <Child></Child>
</Parent>

 

태그 안에 태그를 감싸서 사용할 수 있다. 이때 상위에 있는 요소를 부모 요소라고 칭하고, 안에 있는 요소를 자식 요소라고 칭한다.

 

---

 

 

빠르게 코드 입력하기

Emmet문법은 코드를 빠르게 작성할 수 있는 문법이다. Emmmt 문법을 익혀 코드를 빠르게 입력해보자.

 

docs.emmet.io/

Emmet Documentation