이야기
테이블이나 셀에 배경 그림주고, 반복하지 않게 고정시키기

테이블이나 셀에 배경 그림주고, 반복하지 않게 고정시키기

 

1) 직접 써주기

 

<td background="경로/bg01.gif" style="background-repeat:no-repeat; background-position:bottom;">
<table background="경로/bg02.gif" style="background-repeat:no-repeat; background-positon:top;">

 

2) 테이블에 클래스 명을 지정해주고 <head><style>태그안에 클래스 정의해주기

 

<style>

.left_bg {

  background-image: url(이미지경로/화일명);

  background-repeat: no-repeat;

}

</style>

 

그리고, 테이블에 적용하시려면 <table class="left_bg">

위처럼 해주시면 되구요..

 

아마 배경이 길어저도 좌측배경색상을 유지하시려면 계속유지하시려면, 위의 스타일시트에서빨간색으로 표시된 부분아래쪽으로 background-color : #C4F0F9 한줄 추가해주시면됩니다.

 

참고로

background-repeat :
 repeat       : 배경이미지 연속
 repeat-x     : 배경이미지 가로 방향 연속
 repeat-y     : 배경이미지 세로 방향 연속
 no-repeat    : 배경이미지 한번만 보여 줌

background-position : 

 left         : 배경이미지를 좌측에
 right        : 배경이미지를 우측에
 center       : 배경이미지를 중앙에
 top          : 배경이미지를 위에
 bottom       : 배경이미지를 아래에

background-attachment : 
 scroll       : 배경이미지가 텍스트와 함께 스크롤 
 fixed        : 배경이미지는 고정되고 텍스트만 스크롤

이 게시물을

에디터 선택

※ 주의 : 페이지가 새로고침됩니다

이 댓글을 삭제하시겠습니까?

제목
날짜
2012.06.11

SEARCH