이번시간에는 글쓰기와 관련된 태그들을 알아보도록 하겠다.
우선 기본 HTML 골격을 갖춘 문서를 작성하자.
기억이 나지 않는가? 그렇다면 지난시간의 문서 작성을 다시 보기 바란다.
당부하지만, 매번 할때마다 HTML문서를 새로 작성해야 태그도 기억나고 학습에 도움이 된다.
복사 붙여넣기는 바보가 되는 지름길이다.
자 body와 body사이에 다음과 같이 써넣어 보자.
=========================
Hello World!
My name is GJ Magic!
=========================
다 써넣엇다면 저장 후 실행해보자. 그러면 이상하게도
===================================
Hello World! My name is GJ Magic!
===================================
라고 브라우저상에 나올 것이다.(한줄로 나올 것이다)
HTML 문서상에서는 엔터를 인식하지 않는다. 그렇기 때문에 엔터를 의미하는
태그를 직접 입력하여야 한다. 바로 <br>이다. 이 태그는 닫아주지 않아도 된다.
(</br>이라 하지 않아도 된다)
<br>이 엔터라 하였으니 어떻게 하면 원하는 대로 나올까? 먼저 직접 해보고 아래의 답을 참고 바란다.
답 :
=========================
Hello World!<br>
My name is GJ Magic!
=========================
그렇다면 여러줄 띄우고 싶다면 어떻게 하면 될까? 이렇게 하면 되겠지?
<br><br><br>...
자 그런데, 내 이름은 소중하니까 이름을 강조하고 싶어졌다. 진하게 하고 싶다.
이때 사용하는 태그는 <b></b> 이다.
==========================
Hello World!
My name is GJ Magic!
==========================
GJ Magic이 진하게 된 것이 보인다.
태그를 알려드렸으니 우선 직접 시도해 보기 바란다.
답은 아래에 있다.
==========================
Hello World!<br>
My name is <b>GJ Magic!</b>
==========================
글씨를 진하게 하고싶을 땐 <b></b>
다음엔 글씨에 색상을 넣어보자.
글씨에 대한 색상, 크기등은 <font></font> 태그에 의해 이루어 진다.
예) <font face='궁서체' size='3' color='red'></font>
이름을 글씨체는 궁서, 글씨크기 5, 색상은 파랑으로 바꾸어 보자.
==========================
Hello World!
My name is GJ Magic!
==========================
답은 아래에 있다.
==========================
Hello World!<br>
My name is <b><font face='궁서' color='blue' size='5'>GJ Magic!</font></b>
==========================
옵션들은 순서는 없다. 먼저 열은 것은 먼저 닫아주는 점만 기억하자.
(예 : b를 열고 font를 열엇으니 font를 닫고 b를 닫는다.)
색상에 대해서는 black, white, green, yellow, red, blue, silver, gray...등 으로 줄수도 있지만
RGB코드를 통해 줄수도 있다.
color='#000000'
000000은 검은색 FFFFFF은 흰색을 의미한다. 이에 대한 상세한 설명은 다음기회에...
시험삼아 아무런 6자리 숫자를 주어보자. 그러면 재미있는 색상이 나올지 모른다.
마지막으로 스페이스(공백)를 알려주겠다.
공백도 엔터와 마찬가지로 HTML에서는 인식하지 못한다. 정확히 말하면 글자와 글자사이에 단 한번만 인식한다. 무슨 말인지 모르겠다면 직접 body와 /body사이에 글자들과 공백을 도배해보자. 그러면 공백이 나오지 않는 것을 알 수 있을것이다.
공백은 아래와 같은 표현으로 쓴다.
따라서 공백을 많이 넣고 싶다면,
...
이런 짓을 해야한다. 가능하면 공백은 꼭 필요한데만 쓰도록 하자.. -_-;
이번시간에는 HTML을 통해 글을 표현하는 가장 기본적인 것을 알려드렸다.
엔터는 <br>, 글꼴과 글씨크기 및 색상등은 <font face='' size='' color=''></font>, 굵게는 <b>, 스페이스바는
까먹지 않도록 종종 연습해보는 습관을 기르도록 하자.