HTML 의 기본 구성은 ?
이런식으로 구성이 됩니다.
■ <body> 태그
<body> 태그를 어떻게 사용하느냐에 따라서, 웹 문서를 분위기있게 꾸밀수 있습니다.
위 body 태그는 웹문서의 전체 배경을 바꿔주는 태그 입니다.
<body>태그의 속성을 살펴 보겠습니다.
위에 태그 속성 표에 적은걸 참고로 하여 태그 소스를 한번 만들어 보겠습니다.
<body bgcolor="blue" text="white" link="gray" alink="#33333" vlink="green">
= 위 태그를 보시면, 웹페이지의 배경은 파란배경이고 글자는 흰색 글자이고,
만약에 페이지에 링크가 있다면, 링크 색상은 회색이 됩니다. 링크부분을 클릭하면 진한 회색으로 바뀌고, 클릭된 후의 링크 색상은 녹색으로 바뀌게 된다는 뜻입니다.
<body>태그에 topmargin과 leftmargin 속성을 쓰면, 화면의 어느 지점부터 웹문서의 내용을 나타낼지 픽셀 단위로 지정할 수 있습니다.
<body background=".....gif" topmargin="30" leftmargin="25">
이런식으로 값을 적어주시면 됩니다.
bgproperties 속성을 fixed로 설정하면, 스크롤바를 아래위로 움직여도 배경 그림은 고정이 되어있고, 문서의 내용만 움직이게 됩니다.
<html> -------> 웹페이지의 시작을 나타냄 <head> ------> 웹페이지의 문서요약 정보를 적어줌 <title>타이틀</title> ---> 웹페이지의 제목을 넣는 태그 (웹브라우저의 제목표시줄에 나타남) </head> <body> -------->웹페이지의 내용을 넣는 태그 희야의웹하우스 </body> </html> |
이런식으로 구성이 됩니다.
■ <body> 태그
<body bgcolor="색상값">
(속성) (값)
(속성) (값)
위 body 태그는 웹문서의 전체 배경을 바꿔주는 태그 입니다.
<body>태그의 속성을 살펴 보겠습니다.
<body>태그의 속성 | 값 | 설명 |
bgcolor | 색상 | 웹문서의 배경에 색상을 지정합니다. |
background | 이미지 파일명 | 웹문서의 배경에 이미지를 지정합니다. |
text | 색상 | 웹문서에 나타나는 글자의 색상을 지정합니다. |
link | 색상 | 웹문서에 나타나는 하이퍼링크 글자의 색상을 지정합니다. |
alink | 색상 | 하이퍼링크 글자가 클릭될 때의 색상을 지정합니다. |
vlink | 색상 | 하이퍼링크 글자가 클릭된 후의 색상을 지정합니다. |
topmargin | 픽셀 | 위쪽 여백을 지정합니다. |
leftmargin | 픽셀 | 왼쪽 여백을 지정합니다. |
bgproperties | fixed/scroll | fixed로 설정하면, 스크롤바를 움직여도 배경 이미지가 고정되어 움직이지 않습니다. |
● 배경에 색상 대신 이미지를 넣고 싶다면 ?
<body background="이미지">
이런식으로 적어주시면 됩니다.<body background="이미지">
● 글자의 색상 - text, link, alink, vlink
위에 태그 속성 표에 적은걸 참고로 하여 태그 소스를 한번 만들어 보겠습니다.
<body bgcolor="blue" text="white" link="gray" alink="#33333" vlink="green">
= 위 태그를 보시면, 웹페이지의 배경은 파란배경이고 글자는 흰색 글자이고,
만약에 페이지에 링크가 있다면, 링크 색상은 회색이 됩니다. 링크부분을 클릭하면 진한 회색으로 바뀌고, 클릭된 후의 링크 색상은 녹색으로 바뀌게 된다는 뜻입니다.
● 문서의 여백 - topmargin, leftmargin
<body>태그에 topmargin과 leftmargin 속성을 쓰면, 화면의 어느 지점부터 웹문서의 내용을 나타낼지 픽셀 단위로 지정할 수 있습니다.
<body background=".....gif" topmargin="30" leftmargin="25">
이런식으로 값을 적어주시면 됩니다.
● 배경 그림 고정 - bgproperties
<body background="...........gif" bgproperties="fixed">
<body background="...........gif" bgproperties="fixed">
bgproperties 속성을 fixed로 설정하면, 스크롤바를 아래위로 움직여도 배경 그림은 고정이 되어있고, 문서의 내용만 움직이게 됩니다.
'■ 블로그꾸미기 > HTML/css' 카테고리의 다른 글
[ HTML ] 테이블에 색상을 넣어보자/ 테두리도 꾸미기 (0) | 2010.09.26 |
---|---|
IFRAME 아이프레임 (0) | 2010.09.25 |
[ HTML ] 배경음악을 넣어보자 bgsound/ embed (0) | 2010.09.24 |
[ CSS ] 스타일 시트는 ? (0) | 2010.09.24 |
[ HTML ] 테이블 테두리/색상/cellspacing/cellpadding (0) | 2010.09.24 |
[ HTML ] TABLE 에 대해 알아보자 (0) | 2010.09.24 |