HTML의 기본 문법 (Basic HTML Grammar)

 

HTML의 기본 문법 (Basic HTML Grammar)

기본 문법의 표준이라는 뜻은 정해놓은 규칙이나 절차라는 의미입니다.

웹 표준을 준수한다는 의미는 '정해진 규칙을 잘 치켜서 마크업(makr-up)한다라는 의미입니다.

 

중요한 용어에 대해서 잠깐 설명을 해보겠습니다.

<P> , <spen> , <a> 등과 같은 명령어의 형태가 <>(각괄호)안에 들어가 있을 때 이런 문장들을 [Tag]라고 합니다.

<P>~</P>와 같은 태그[Tag]의 시작과 끝에는 <>으로 시작해서 </>로 끝나게 되어 있습니다.

이러한 각 괄호 안에 들어가 있는 <>~</>를 요서[element]라고 합니다.

 

XHTML 문법의 규칙은 다음과 같습니다.

 

요소는 정확하게 중첩되어야 합니다.

<p> 중첩된 요소가 있을때 <strong>정확하게</strong>표현해야 합니다.</p>..............................................[o]

<p> 중첩된 요소가 있을때 <strong>정확하게</p>표현해야 합니다.</strong>..............................................[x]

마지막에 정의한 태그[Tag]를 가장 먼저 닫아야 합니다.

 

 

요소 및 속성 이름은 소문자로 표기합니다.

<p><a href="index.html">첫페이지</a></p>....................................[o]

<P><A HREF="index.html">첫페이지</A></P>.................................[x]

<a>요소에서 'href'를 속성[attribute]라고 합니다.

'='다음에 오는 것을 값[value]라고 표현합니다.

요소는 꼭 닫아서 마무리를 합니다.

<p> 요소는 꼭<strong>닫아서 마무리를</strong>해야합니다.</p>............................[o]

<p> 요소는 꼭<strong>닫아서 마무리를</strong>해야합니다........................................[x]

한 쌍의 태그[Tag]<>~</>형식의 요소로 이루어져 있지 않고 하나의 태그[Tag]로 되어 있는 요소도 있습니다.

이런 요소들을 '빈 요소[empty element]'라고 합니다.

 

자주 쓰이는 빈요소는 아래와 같고</>로 꼭 닫아주어야 합니다.

<br> , <hr> , <img> , <input> , <area> , <meta> , <link>.......</>

 

속성값에는 인용 부호를 붙여야 합니다.

<a href="index.html">첫페이지</a>...............................[o]

<a href=index.html>첫페이지</a>...................................[x]

간단하게 이해를 하자면 '=' 다음에 오는 문장들은 값이라고 하는데 이러한 값에는 인용부호를 붙여야 합니다.

 

속성은 속성값과 함께 사용해야 합니다.

<a href="index.html">첫페이지</a>...............................[o]

<a href>첫페이지</a>...........................................................[o]

 

속성은 항상 속성값과 함께 선언을 해야 하며 생략을 하면 안됩니다.

 

img와 area 효소에는 art 속성이 있어야 합니다.

<img src="img/mein.gif" alt="today"/>...................[o]

<img src="img/mein.gif" />...........................................[x]

 

<img>요소에 alt가 따라와 주어야 하는 이유는 문법적으로 필요하고 이미지를 볼 수 없는 성황에서도 충분히 그 이미지에 대한 정보를 제공해 주기 위해서 입니다. 이 부분은 뒤에 img요소를 설명할때 자세히 다루도록 하겠습니다.

중요한건 alt가 따라와주어야 한다는 것입니다. 

 

특수 문자를 사용할 때는 entity name 또는 entity code를 사용해야 합니다.

me &amp ; me</p>...........................[o]  &amp ;는 툭수문자 '&amp'는 특수 문자 '&'의 entity name 

me &#38 ; me </p>...........................[o]  &#38 ;는 특수문자 '&'의 entity code

me & me </p>.....................................[x]

 

주석처리 방법입니다.

주석은 일반적으로 협업, 공동작업이나 다음 작업자가 현재 작업 내용을 쉽게 알아 볼 수 있도록 도와주는 설명문형식의 문장입니다.

HTML편집기에서는 보이지만 브라우저 화면에 출력되지는 않습니다.

<!--주석 시작-->

<!--여기까지가 주석끝-->