HTML 태그 기초
▣ HTML 태그 기초
■ 예전부터 HTML 공부에 관심이 있었는데....그동안 멀리하다가 이제서야 시간이 좀 될듯해서 집에서 굴러다니던 책을 다시 펴들었습니다. 그냥 읽고 지나가는 것보단 이것저것 해보는게 도움이 많이 될 거 같아서 이렇게 블로그에 저만의 노트 정리하듯이 글을 작성해보려고 합니다. 최종 목표는 HTML을 이용해서 홈페이지를 만들어보는 건데요. 지금 처음 시작하는 거에요. 혹시 함께 공부하실 분들은 같이 해요.^^
그럼 첫번째로 이번에는 기본적인 HTML 태그와 기본구조에 대해서 정리 해볼게요. 기본 개념 부분에서 이해가 잘 되지 않더라도 아래쪽에서 직접 예제를 만들어보면 쉽게 이해가 되실 거에요.
■ HTML 태그의 기본 구조는 다음과 같습니다.
<태그명> 태그 명령에 의해 수행할 문장이나 문서 </태그명> |
■ 다음은 HTML 태그의 기본 속성에 대해서 알아볼게요. 
1. 태그 명령어는 대.소문자를 구분하지 않습니다.
2. 령령어를 잘못 입력해도 에러가 발생하지 않고 그냥 넘어가게 되거든요. 정상적으로 실행이 안 될때는 잘못된 부분을 찾아야 합니다.
3. HTML 태그에서 사용한 문자열(문장) 에서는 줄간의 공백을 인정하지 않습니다. 즉 어떤 문장을 작성하고, 다음 줄을 띄우고 다음 문장을 작성하려면 </P>라는 태그를 이용하게 되는데요. 예제를 하나 만들어서 천천히 알아보도록 하겠습니다.
■ 그럼 본격적으로 예제를 하나 만들어보고 HTML의 기본 구조를 알아보겠습니다. HTML을 입력할 수 있는 방법을 많지만 저 같은 초보가 공부하기에는 메모장에 하나하나 직접 입력해보는게 도움이 될거 같아서...메모장을 이용하도록 하겠습니다. 
■ 가장 기본적인 형식의 HTML을 입력해 봤는데요. 태그를 하나씩 살펴볼게요.
1. <HTML>...</HTML> : 문서의 시작과 끝을 알려주는 태그입니다.
2. <HEAD>...</HEAD> : 문서의 머리말 부분에 해당하는 부분인데요. 문서의 제목정도로 생각하면 되는데요. 보통 HEAD 태그 안에는 <TITLE> 태그를 넣습니다.
3. <TITLE>...</TITLE> : 문서의 제목을 입력하는 부분입니다.
4. <BODY>...</BODY> : 문서에서 실제로 출력되는 본문에 해당되는 내용을 입력하는 곳입니다.
■ 이제 이 파일을 저장하고 실행해서 제대로 출력이 되는지 확인해볼게요.
■ 메모장에 작성한 HTML 문서를 저장할 떄는 그림과 같이 [파일 형식]을 모든 파일로 변경해주고, 파일 이름에는 XXXX.HTML 형식으로 저장해 주면 됩니다. 
■ 이렇게 인터넷 아이콘으로 해서 저장이 되는데요. 더블 클릭해서 실행하면...
■ '인터넷 익스플로러'에서 좀 전에 작성한 HTML 문서가 실행된 모습니다. <TITLE> 부분에 입력했던 내용이 제목으로 출력되구요. <BODY>입력한 본문 내용이 제대로 출력되는 걸 확인할 수 있습니다. 
■ 이렇게 HTLM의 전체적인 구조를 알아봤구요. 앞으로 계속해서 세부적인 내용을 파고 들어가 볼게요. 나중에는 자바스크립트를 함께 이용해서 홈페이지까지 만들어보는게 저의 목표 입니다. ^^ 처음 시작하시는분들 함께 공부했으면 좋겠네요. ㅎㅎ 수고하셨어요.^^