배경태그 (background)
자 이제 홈페이지에 배경색,또는 배경화면을 넣는 태그를 배워봅시닷!
먼저 배경을 지정하는 태그는 두가지가 있습니다.
배경 색만 지정하는 bgcolor 와 배경을 이미지로 하는 background 태그입니다.
1. 그럼 우선 bgcolor 태그를 사용하는 방법을 알아보겠습니다.
HTML 문서에 <body> 라고 되어있는 부분이 있습니다.
그럼 이제 <body> 부분을 고쳐줍니다.
<body bgcolor="red"> ㅡ> 배경 색깔이 빨간색(red) 이 됩니다.
<body bgcolor="black"> 이렇게하면 검은 바탕이되죠.(black)
<body bgcolor="0000cc"> 이런식으로 코드를 넣어도 됩니다.(0000cc=진한파랑)
아무튼, <body bgcolor="이 사이에"> 원하는 색깔의 코드나 색명을 적으세요.
그럼,
2.다음으로 background 태그입니다.
이것도 마찬가지로 <body>에 지정해줍니다.
<body background="그림주소"> 이렇게요.
아무 그림이든 상관없습니다. (jpg,gif,bmp...등등. 그러나 배경은 gif를 가장 선호)
EX) <body background="http://pierload.x-y.net/images/imgmap.jpg">
태그연습장에 실행시켜 보세요. 그림이 바둑판식으로 배경에 나타납니다.
바둑판식으로 하기에 좋은 배경그림 몇가지>
<body background="http://pierload.x-y.net/img/exbg1.gif">
<body background="http://pierload.x-y.net/img/exbg2.gif">
<body background="http://pierload.x-y.net/img/exbg3.gif">
<body background="http://pierload.x-y.net/img/exbg4.gif">
<body background="http://pierload.x-y.net/img/exbg5.gif">
<body background="http://pierload.x-y.net/img/exbg6.gif">
<body background="http://pierload.x-y.net/img/exbg7.gif">
<body background="http://pierload.x-y.net/img/exbg8.gif">
HTML 문서에 <body> 라고 되어있는 부분이 있습니다.
그럼 이제 <body> 부분을 고쳐줍니다.
<body bgcolor="red"> ㅡ> 배경 색깔이 빨간색(red) 이 됩니다.
<body bgcolor="black"> 이렇게하면 검은 바탕이되죠.(black)
<body bgcolor="0000cc"> 이런식으로 코드를 넣어도 됩니다.(0000cc=진한파랑)
아무튼, <body bgcolor="이 사이에"> 원하는 색깔의 코드나 색명을 적으세요.
그럼,
2.다음으로 background 태그입니다.
이것도 마찬가지로 <body>에 지정해줍니다.
<body background="그림주소"> 이렇게요.
아무 그림이든 상관없습니다. (jpg,gif,bmp...등등. 그러나 배경은 gif를 가장 선호)
EX) <body background="http://pierload.x-y.net/images/imgmap.jpg">
태그연습장에 실행시켜 보세요. 그림이 바둑판식으로 배경에 나타납니다.
바둑판식으로 하기에 좋은 배경그림 몇가지>
<body background="http://pierload.x-y.net/img/exbg1.gif">
<body background="http://pierload.x-y.net/img/exbg2.gif">
<body background="http://pierload.x-y.net/img/exbg3.gif">
<body background="http://pierload.x-y.net/img/exbg4.gif">
<body background="http://pierload.x-y.net/img/exbg5.gif">
<body background="http://pierload.x-y.net/img/exbg6.gif">
<body background="http://pierload.x-y.net/img/exbg7.gif">
<body background="http://pierload.x-y.net/img/exbg8.gif">
음. 그리고 또 그림을 특정위치에 고정시킬 수 있는 방법도 있습니다.
이렇게 하면 됩니다.
<style TYPE="TEXT/CSS">
BODY {background:url(http://pierload.x-y.net/img/bgimg2.jpg) white fixed no-repeat 100% 100%}
</style>
여기서 파란색으로 되어있는 주소 부분과 퍼센트 부분만 바꾸시면 원하시는 그림을
원하는 위치에 고정시키실 수 있으며 스크롤바가 내려가도 절대 움직이지 않습니다..
<<※ 퍼센트에서 왼쪽건 가로, 오른쪽건 세로 이고, 퍼센트가 높을수록 오른쪽으로,아래로 갑니다>>
그냥 바디(body) 태그로 고정시킬 수 도 있습니다!
<body background="그림주소" bgproperties="fixed">
이렇게 해주시면 되구요. 이 속성을 쓰시면 바둑판식으로 되고, 고정됩니다.
알겠죠? 위에껀 그냥 위치정하구 고정,요건 바둑판식고정.
출처 : 천년그리움이 흐르는 강
글쓴이 : 즐거움이 원글보기
메모 :
'삶의 휘몰이 > MY JOB' 카테고리의 다른 글
| 그대의 삶에 평강있기를......... (0) | 2008.07.01 |
|---|---|
| 진짜같은가짜 (0) | 2008.07.01 |
| [스크랩] 각종 테그의 예제 (0) | 2008.06.16 |
| [스크랩] HTML 태그사전 (0) | 2008.06.16 |
| [스크랩] 태그 자동 생성기 (0) | 2008.06.16 |