f

게시판 이나 테이블 <TD>값에 배경이미지 고정하기

TD뿐만 아니라 BODY값에서도 적용가능하며, 배경이미지를 고정시켜 항상 제자리에 있는 느낌을 주게 하는 팁앤테크~

------------------------------------
## 배경이미지 고정 스타일시트 정의 ##
------------------------------------
<style type="text/css">
BODY {
margin-left: 1em; /* 고정 이미지가 보이도록 열어 준 것임 */
background-image: url('http://trio.co.kr/gif/bnvtrio.gif');
background-position: 260 left; /* 디폴트는 top left, 혹은 0 0 */
background-attachment: fixed;
background-repeat: no-repeat; /* 디폴트는 repeat */
}
</style>

## background=position 의 값을 어떻게 주느냐에 따라 배경이미지의 위치가 달라진다.
## 0 0 => 왼쪽 상단 , bottom 0 => 하단 왼쪽, bottom right => 하단 오른쪽....등으로 표현할수있다.

[예제응용]

1. 스타일시트를 사용하지 않고 바로 해당 테이블이나 <TD>에 적용할 경우는 아래와 같다.

<TD style='background-image:url(이미지경로/이미지.gif); background-repeat:no-repeat; background-position:bottom right; background-attachment:fixed;'></TD><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
|

댓글 2개

좋은 팁이군요...감사합니다...
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
07-10-13 조회 5,146
07-10-03 조회 4,119
07-10-03 조회 3,318
07-10-03 조회 2,557
07-10-03 조회 4,640
07-10-02 조회 2,981
07-10-01 조회 3,608
07-09-28 조회 3,512
07-09-27 조회 4,578
07-08-16 조회 6,421
07-08-04 조회 2,873
07-07-25 조회 6,139
07-07-05 조회 4,019
07-07-02 조회 4,567
07-06-30 조회 4,468
07-06-20 조회 7,357
07-06-20 조회 3,967
07-06-05 조회 4,144
07-05-26 조회 3,176
07-05-17 조회 9,173
07-05-17 조회 5,218
07-05-04 조회 6,138
07-04-15 조회 6,223
07-04-13 조회 4,010
07-04-11 조회 3,408
07-03-20 조회 3,587
07-03-02 조회 6,804
07-02-27 조회 6,074
07-02-22 조회 4,475
07-01-30 조회 6,301
07-01-30 조회 1만
06-12-20 조회 3,791
06-12-18 조회 4,638
06-12-15 조회 4,600
06-12-15 조회 3,833
06-12-15 조회 3,225
06-11-30 조회 3,659
06-11-27 조회 4,558
06-10-24 조회 6,473
06-10-17 조회 4,781
06-09-22 조회 4,522
06-09-21 조회 6,023
06-09-21 조회 3,940
06-09-15 조회 6,563
06-08-20 조회 3,711
06-07-19 조회 3,351
06-07-14 조회 4,248
06-07-14 조회 4,113
06-07-11 조회 5,722
06-06-08 조회 4,300
06-06-08 조회 4,208
06-05-24 조회 3,522
06-05-24 조회 4,907
06-05-17 조회 3,622
06-05-16 조회 4,374
06-05-14 조회 6,064
06-05-12 조회 3,639
06-05-06 조회 4,276
06-05-06 조회 4,351
06-05-06 조회 3,659
06-05-06 조회 3,730
06-05-06 조회 4,176
06-04-25 조회 4,040
06-03-23 조회 5,507
06-01-20 조회 4,077
06-01-04 조회 4,287
05-12-30 조회 4,161
05-12-21 조회 4,844
05-11-09 조회 4,048
05-11-09 조회 3,817
05-10-09 조회 3,467
05-09-21 조회 6,862
05-08-14 조회 4,344
05-08-04 조회 5,529
05-07-14 조회 4,591
05-06-15 조회 4,997
05-04-23 조회 4,577
05-04-20 조회 5,036
05-04-19 조회 1.1만
05-04-19 조회 6,001
05-03-15 조회 3,819
05-03-15 조회 4,261
05-03-13 조회 2,950
05-03-13 조회 3,462
05-03-13 조회 3,460
05-03-13 조회 2,757
05-03-13 조회 5,786
05-03-13 조회 5,416
05-03-13 조회 4,348
05-03-13 조회 4,648
05-03-13 조회 7,905
05-03-13 조회 4,406
05-03-13 조회 3,490
05-03-13 조회 3,485
05-03-13 조회 8,028
05-03-13 조회 5,494
05-03-13 조회 4,141
05-03-12 조회 3,791
05-03-12 조회 4,492
05-02-24 조회 4,639