검색

HTML 태그의 속성 <14>

- 작게+ 크게

크리스천비전
기사입력 2016-05-07

 

▲그레이스미션신학대학교 행정처장 구자혁 교수     © 크리스천비전

 

   태그의 속성으로 태그 사용 시 반드시 쌍을 이루어야 하는 것과 쌍을 이루지 않는 것, 그리고 태그의 특별한 기능(속성)을 가지고 있는 것과 없는 것으로 구분한다.

 

1. 쌍으로 사용되는 태그

<title>..</title>: 타이틀 이름 지정 태그

<h2>..</h2>: 제목의 크기 지정 태그

<center>..</center> : 문단 정렬을 중앙으로 하는 태그 등

 

2. 단독으로 사용되는 태그

<br> : 줄 바꾸기 태그

<p> : 줄 바꾸고 문장 한 줄 띄기 태그

<hr> : 선 표시 태그 등 

 

3. 태그 중에는 속성을 가지는 태그

<a href=..>..</a> 하이퍼 링크 태그

<img src=..> 이미지 링크 태그

 

4. 태그 속성 없이 사용하는 태그

<B>.</B> : 글자체를 Bold (두껍게) 표시 해 주는 태그 등

 

태그(tag)의 특성

   이러한 태그는 다음의 일반적인 특성을 가지고 있다. 따라서 태그 작성시 이를 고려하여 작성하여야 한다.

 

1. 태그는 대소 문자를 구별하지 않는다.

   즉 <HTML>, <hTml>, <htMl>, <html>은 모두 같은 태그로 인식한다

그러나 대소 문자의 구분은 없지만 이미지 링크 혹은 하이퍼 링크와 같은 경로 속성인 경우 유닉스 혹은 리눅스 시스템에서는 대소 문자가 구분되기 때문에 주의를 해야 한다. 주의를 하지 않는 경우 링크의 오류가 발생된다. 따라서 html 문서 작업 시 소문자로 통일하여 사용하는 것을 권장한다.

 

2. 쌍으로 존재하는 태그들은 반드시 쌍으로 사용하여야 한다.

   쌍으로 사용하는 태그들을 쌍으로 사용하지 않고 엇갈려서 사용할 경우 예상한 결과와 다른 화면이 나타난다.

 

3. 포함할 수 없는 태그는 포함시키지 않는다.

   태그에 포함되지 않아도 되는 태그를 사용하거나 태그를 2중으로 사용하는 경우가 해당된다.

 

4. 태그를 사용하지 않는 공백은 1글자의 공백으로 인식된다.

   다음의 모든 경우가 1글자의 공백으로만 인식됨

- 공백(space)문자가 연속

- 엔터(enter)

- 탭(tab)문자

- 공백문자, 엔 터, 탭이 섞여서 연속 시

 

기본 태그 이해 

1. 홈페이지에서 HTML 소스 보기

   기존의 타 사이트의 홈페이지에서 만들어진 태그를 살펴보는 방법으로 웹 브라우저의 소스 보기라는 기능을 이용하여 홈페이지가 만들어진 소스라고 하는 HTML태그들의 내용을 살펴볼 수 있다.

 

   이 기능을 이용하여 타 사이트에서 만들어진 홈페이지 태그를 참조하는데 도움이 된다. HTML 문서로 제작된 홈페이지인 경우 거의 모든 소스를 살펴볼 수 있지만 데이터 베이스 및 별도 웹 프로그램으로 제작된 경우 화면에 나타나는 태그만 볼 수 있다.

사용방법> 웹 브라워져 => 보기 -> 소스 보기

 

소스 보기 선택 시 메모장이 실행되면서 소스 화면의 태그가 나타난다.

 

2. HTML의 시작과 끝

   HTML문서의 맨 처음에 나온 <HTML>..</HTML> 이건 HTML의 시작을 나타내는 태그입니다. HTML 문서라는 것을 알려 준다. 시작을 <HTML>시작해서 마지막에 </html>로 마무리 한다. 모든 태그는 이 시작과 끝 사이에 존재한다. 즉 모든 태그는 시작과 끝 사이에 존재한다.

 

3. HEAD 는 문서의 속성을 나타냄

   <HTML>시작 다음에 사용되는 태그가 <HEAD> 태그이다. <HEAD> 태그는 <HEAD>..</HEAD>와 같이 쌍으로 이루어 지는 태그로 다음의 것들이 여기에 존재한다.

 

① 페이지의 타이틀 제목<TITLE>..</TITLE>부분

② 자바스크립트

③ 스타일시트 등

 

4. <BODY>태그는 본문

   <HEAD> 태그 다음으로 존재하는 것이 <BODY> 태그 입니다. <BODY> 태그는 <BODY>..</BODY>와 같이 쌍으로 이루어지며 이 부분에 모든 실제 홈페이지를 이루는 텍스트, 이미지 등을 태그를 이용해서 작성하게 된다.

 

트위터 페이스북 카카오톡 카카오스토리 band naver URL복사
URL 복사
x

PC버전

Copyright ⓒ 크리스천비전. All rights reserved.