|
|
안녕하세요~ 초보도 만들 수 있는 블로그 스킨 제작 가이드 세번째 강좌가 찾아왔습니다!!^^
지난 강좌에서는 HTML 이란 놈이 도대체 무엇인지?? 와 HTML문서의 기본구조 및 실행 방법에 대해 알아보았습니다.
이번 시간은 웹에서 사용되는 글꼴에 태그를 사용하여 다영한 변화를 주는 방법에 대해서 알아보겠습니다.
되도록 실전예제를 통해 진행 할 생각이니 너무 어렵게 생각하지 마시고 천천히 따라오시기 바랍니다~
읽다가 어렵거나 재미없다고 절대 포기하시면 안돼요~!!
|
지난 글 보기 |
 학습목표
● 다양한 글꼴의 사용법을 이해한다. ● 글자의 크기,색깔,서체 등을 지정하는 방법을 익힌다. ● 색깔이름, 16진수 RGB 코드를 살펴보고, 직접 사용해 본다.
 지난강좌에서 처럼 한가지 글자체로만 웹 문서를 만든다면 단조롭고 너무 밋밋해 보일 것입니다. 그래서 좀 더 글에 특색을 주기위해 우리가 아래한글 같은 워드프로세서를 이용해서 다양한 글씨체로 문서를 작성하듯이 웹 문서를 작성해보도록 하겠습니다. |
 글꼴 지정하기
 윈도우 제어판에서 글꼴을 더블클릭하면 자신의 PC에 설치 되어 있는 글꼴들을 볼 수 있습니다. 거기에 나와있는 글꼴들을 모두 사용할 수 있습니다만, 내 홈페이지를 방문한 사용자의 컴퓨터에 여기 지정된 글꼴이 설치되어 있지 않다면 기본 글꼴로 표시됩니다. 그래서, 보통 특수한 글꼴이 필요한 경우는 이미지로 만들어서 많이 이용하게 됩니다...
그러면 <FONT> 태그를 사용하여 글자의 크기 및 대표적인 몇가지 글꼴을 지정해보도록 하겠습니다. 메모장에 아래와 같이 입력해 보시기 바랍니다. 참고로, 대문자와 소문자 둘다 사용하셔도 됩니다... 저는 편의상 알아보기 쉽게 대문자로 작성해보았습니다.  위 HTML 문서를 실행하면 아래 첨부한 파일 처럼 나오게 됩니다. FONT 는 SIZE=3 이 기본적입니다. 폰트 싸이즈를 지정하지 않으면 3 이 된다는 말이죠. 참고로, 보통 웹문서에서 가장 무난하면서 많이 쓰는 size는 2 입니다. |
글자크기와 글꼴지정하기.html 글자 강조하기
 위 메모장의 내용을 제대로 입력하셨다면 아래 첨부 파일 처럼 나오게 됩니다. <B></B> 사이에 지정된 글자들이 굵고 진하게 나타나는게 보이시죠? 그럼 제대로 된 겁니다. 이번에는 폰트 색깔, 서체, 싸이즈, 진하게, 밑줄, 이탤릭체 지정을 동시에 지정해 보도록 하겠습니다. 
|
 줄 바꾸기 마지막으로 이번 강좌 처음부터 나왔던 <BR>태그를 적용해 보도록 하겠습니다. <BR>태그는 우리가 워드 문서를 작성할 때 쓰는 Enter키와 같이 웹문서에서 줄을 바꿀때 줄 바꿀 끝위치에 삽입 됩니다. 쉽게 말하면, HTML문서에서는 줄을 바꾸려고 아무리 Enter키를 쳐봐야 소용이 없으며 <BR>태그를 사용하여야 Enter를 누른 것과 같은 효과를 볼 수 있다는 뜻 입니다. 그리고 문단을 구분해 줄때는 <P>를 씁니다. 이때 문단 사이에는 한 줄의 여백이 생깁니다.  위와 같이 메모장에 입력하시면 아래와 같은 웹문서가 만들어 집니다. |
 글을 마치며
 지금까지 글자모양과 관련된 폰트태그들을 공부해 보았습니다. 이제 HTML 문서를 작성하는데 조금씩 자신감이 생기시죠?? 그럼, 다음강좌에서는 반드시 알아야 할 기본태그를 정리해 보도록 하겠습니다. 다음강좌까지 여태까지 배웠던 내용들을 머리속에 잘 암기해두시기 바랍니다~
|
댓글