HTML문법

태그(Tag)

태그는 <,> 기호로 표현하며 <,>기호 사이에 태그 이름이 들어갑니다.

대부분 태그는 시작 태그와 종료 태그로 이루어지며 종료 태그는 태그이름 앞에 '/' 기호가 붙습니다.

시작태그와 종료태그 사이에 실제 화면에 표현될 내용을 기재합니다.

ex :) <h1>Hello, HTML</h1>

이 태그문 한 문장 전체를 가리켜 요소(Element) 혹은 태그라고 부르기도 합니다.

---

속성(Attribute)

속성은 태그에 추가로 정보를 제공하거나 태그의 동작이나 표현을 제어할 수 있는 설정값입니다.

속성은 이름과 값으로 구성됩니다.

시작태그에서 태그 이름 뒤에 한칸 뛰어쓰기 후  속성이름="속성값"  형태로 표현합니다.

속성값은 쌍따옴표("속성값"), 홑따옴표('속성값') 모두 표현 가능하며 둘 중 통일하여 이용합니다.

ex:) <h1 id="title">Hello,html</h1>

ex2:) <h1 id="title" class="test">Hello,html</h1>

ex2처럼 여러개의 속성을 선언해도 되며 이때 속성의 순서는 상관이 없습니다.

 

속성의 종류

모든 태그에 사용 가능한 글로벌 속성과 특정 태그에서만 사용할 수 있는 속성으로 구분됩니다.

또한 선택적으로 사용 가능한 속성과 특정 태그에서 필수적으로 필요한 필수 속성으로 구분됩니다.

 

---

태그 중첩(Nesting Tags)

태그중첩은 태그 안에 다른 태그를 선언하는 것을 의미합니다.

단, 중첩되는 태그는 부모태그를 벗어나지 않도록 주의해야합니다.

Ex: <h1>Hello, <i>HTML</i></h1>

잘못된 ex:) <h1>Hello <i>HTML</h1></i>

 

---

빈 태그(Empty Tag)

기본적으로 태그는 시작태그와 종료태그로 구성되지만 그렇지 않은 태그도 존재합니다.

이러한 시작 태그만 있고 종료 태그가 없는 태그들을 빈 태그라고 부릅니다.

빈 태그는 내용만 비어있을 뿐 속성을 통해 화면에 표시되거나, 화면에 표시되지않더라도 다른 용도로 이용됩니다.

빈 태그의 대표적인 경우는 브라우저가 직접 화면에 내용을 그려줘야 하는 경우입니다.(대체태그)

ex. <img> 태그 : 브라우저에게 이미지 경로만 전달하면 브라우저가 화면에 이미지를 그립니다.

실제로 화면에 출력될 내용이 없어 다른 용도로 쓰이는 태그도 있습니다.

ex. <br> 태그

---

공백(Space)

기본적으로 HTML은 두칸 이상의 공백과 개행은 무시합니다.

아래 내용처럼 h1태그에 대해 공백과 개행을 다르게 내용을 입력해도 모두 같은 텍스트가 화면에 나타납니다.

 

---

주석(Comment Tags)

주석은 화면에 노출되지 않고 메모의 목적으로만 사용됩니다.

실제 사용자가 아닌 개발자를 위한 목적으로 쓰여집니다.

ex: <!-- 주석을 입력합니다. 참고용 입니다.-->