HTML 문법 - 2 (속성과 기본 태그들)

HTML의 포함 관계는 개행으로 정리한다고 한다.

 

HTML의 태그는 여러 속성을 갖는다.

<p class = 'value'> 와 같은 경우 p는 태그의 이름이고, class는 속성의 이름, value는 속성의 값, 그리고 이 뒤에 닫힌 태그가 오기 전까지 내용이 들어있다.

 

속성(attributes)

element에 추가적인 정보 및 설정을 적용할 때 이용한다.

무조건 대문자를 이용해야 하는 것은 아니지만 보통 소문자로 작성한다.

태그에 class='value'와 같은 형태로 작성한다.

대표적으로 <a> 태그에 이용하는 경우가 있다.

<a href="link">

a라는 태그에 href라는 속성에 'link'라는 값을 넣어준 것이다.

 

내용 부분에 들어가는 엔터나 여러 공백은 그냥 하나의 공백으로 취급한다.

<h1>가 나  다   라    마     바      사
마</h1>

이와 같이 작성해도 실행시켜보면

이와 같이 한 칸의 공백으로 바뀌어서 보이게 된다.

 

그러므로 여러 개의 공백을 실제로 이용하고 싶다면 &nbsp;와 같은 것들을 이용해주어야 한다.

 

<!--  -->

<!-- --> 는 !-- 와 -- 사이에 주석을 넣는다.

실제 웹 페이지에는 나타나지 않는다.

 

<h> </h>

<h> </h> 는 보통 제목을 나타낼 때 이용한다. <h1> </h1> 이런 식으로 뒤에 숫자를 붙여서 사용하는 것도 가능하다. <h1>에서 <h6>로 갈 수록 글자의 크기가 작아진다. <h> 태그 뒤에 오는 내용은 강조 된다.

 

<p> </p>

p는 단락(paragraph)으로 <p> </p> 는 보통 단락을 나타낼 때 이용한다.

단락이므로 개행이 일어나는데 뒤에만 일어나는 것이 아닌 문장의 앞 뒤로 모두 일어나는게 특징이다.

 

<a>

a는 닻(anchor)으로 <a> 의 경우 보통 <a href='link'> 와 같은 형태로 만나볼 수 있다.

 

<br>

<br> break으로 강제로 개행을 시킬 때 사용한다. 닫는 태그가 없는 태그이다.

 

<pre> </pre>

<pre> </pre> 는 preformatted text로 미리 정의된 서식을 이용하는 태그이다.

태그 사이의 내용을 그대로 출력한다. 

<pre>
테스트
테 스 트
테   스   트


테스트
</pre>

이런 식으로 작성 시 홈페이지에서는

 

이렇게 여러개의 공백이나 개행까지 포함해서 보여지게 된다.

안에 <br>과 같은 태그들을 적어도 정상적으로 잘 작동이 된다.

다만 작성 시 개행문자가 있다면 개행문자까지 포함이 되므로 주의해야 한다.

 

<hr>

<hr> 은 수평선을 표시하는 태그이다. <br> 태그와 마찬가지로 닫는 태그가 없다.

이런 수평선을 표시하게 된다.