태그(Tag) 두번째 시간입니다. 이전 시간에는 태그와 HTML정의에 대해서 알아 보았습니다.
오늘은 HTML의 기본 구조에 대해서 알아 보도록 하겠습니다. 앞으로 진행되는 태그 명령어는 기초적인 것들이므로 구조와 형식및 명령어는 외우시길 바랍니다.
※ 태그를 배우실때 유의사항
1. 메모장을 준비하시고 눈으로 이해하지만 말고 꼭 따라서 여러번 연습합니다.
2. 연습하실때는 메모장에 직접 예제를 쓰면서 익히세요. 단, 태그명령어를 복사기능을 사용하지 마시고, 직접 하나씩 쳐서 연습하시기 바랍니다.
3. 태그연습용 폴더를 따로 만들어 두고 저장 하시고 실행해서 오류를 수정하면서 반복 연습을 합니다.
4. 저장하실때는 확장자를 꼭 .html로 저장하셔야 합니다.
5. 저장파일 이름을 되도록 영어로 해주셔야 합니다.(예: abc.html형식으로...스킨에 활용하실때나 홈페이지를 만드실때 한글파일은 스크립트 오류가 나므로 처음부터 영어파일로 연습을 해두셔야 편합니다.)
| ● 태그의 기본 원리 이해하기 | |
앞으로 배우는 각 태그명령어들은 다음과 같은 속성을 가지고 실행됩니다.
<태그명령어>~내용~</태그명령어>의 공식을 꼭 지켜 주셔야 합니다.
<태그명령어></태그명령어>사이의 내용에는 또 다른 태그나 스크립트등 여러 가지 내용을 첨가 하게 됩니다.
<태그명령어>로 열고 </태그명령어>로 닫기로 마무리가 되어야 완성된 태그입니다.
1. <태그명령어> : <>안의 태그명령어로 시작 또는 열기 태그입니다.
2. </태그명령어>: </>안의 태그명령어로 끝내기 또는 닫기 태그입니다.
위 1번과 2번 사이에 내용이 들어 가며, 꼭 태그를 1번으로 시작하고 2번으로 끝내기를 하셔야 실행이 됩니다.
3. 독립태그: <br>,<p>태그는 위의 공식과 별개로 단독적으로 실행되는 태그입니다.
(예: 안녕하세요<br>,안녕하세요<p>와 같이 닫기 태그없이 단독적으로 실행되는 태그입니다.)
태그 실행 예( 아래 코드를 메모장에 쓰시고 .html로 저장하시고 실행해 보세요.)
<html>
<head>
<title>태그연습</title>
</head>
<body>태그연습을 하고 있습니다. 이곳은 내용을 쓰는 곳입니다. 실행 되었을까요?
</body>
</html>
| ● HTML(문서)의 기본 구조 익히기 | |
<html>: HTML. 문서의 시작을 명령하는 태그입니다.
<head>: HTM. 문서의 머리말 부분을 말하는 태그입니다.
<title>:HTML. 문서의 제목을 말하는 태그입니다.(실행시 문서의 제목란에 보여집니다.)
<body>: HTML. 문서의 본문에 해당되는 명령어를 실행하는 태그입니다.
※ 실행예는 위의 예를 실행하는 것과 동일하므로 본문내용을 바꿔가며 반복 연습하여 익히세요.
참고: 메모장 찾는 법과 메모장에서 html파일로 저장하는 방법
1. 메모장을 연다.
컴퓨터시작 메뉴를 누르고 모든 프로그램에서 메모장을 찾는다.
※ 시작프로그램에 메모장이 자동으로 지정 되어 있지 않을 경우 아래에서 찾기 바랍니다.
2. 메모장 html파일로 저장하기.
모든파일로 지정 한 후 .html형식으로 저장한다.
많이 어렵진 않으 셨죠? 태그가 알고보면 쉬운데, 처음 접하시는 분들에겐 생소할 수있습니다. 한번에 너무 많은 내용을 전부 올리면 헷갈려 하실듯하여 작은 분량으로 하나씩 올릴께요. 태그 실행이 안되시거나 문의 할게 있으시면, 메일로 파일을 첨부하여 문의 바랍니다. 곧 Q&A 게시판도 만들계획이니 불편하시더라도 메일로 문의 해주세요. 메일은 공지에 안내 되어 있습니다.
제 강좌가 맘에 드셨다면 추천과 믹시 듬뿍주고 가세요. 추천으로 강의료 대신할께요. 창작블로그에 "웹디자인과 블로그팁"을 연재 중입니다. 함께 추천 해주시면 감사할께요^^&
'Design Tutorial > HTML/CSS' 카테고리의 다른 글
| HTML, 문서의 기본 구조 복습과 테스트 (24) | 2009/12/12 |
|---|---|
| HTML, 문서 단락 태그에 대해 배워보자. (34) | 2009/12/01 |
| HTML, 글자에 관한 태그_font의 기본속성 알기 (10) | 2009/11/24 |
| HTML문서의 제목과 관련한 태그를 배우자. (26) | 2009/11/22 |
| html문서의 기본 구조와 메모장 쓰기. (10) | 2009/11/20 |
| HTML, 태그(Tag)와 html에 대해 알아 보자. (26) | 2009/11/17 |
posted by 예스비™
