css repeat part of

Question

은 div의 아래쪽 배경 부분 만 반복하는 방법입니다. 나는 div의 90 %를 말하기 위해 하나의 background repeat-y를 갖고 싶다. 그리고 나서 bottom을위한 다른 배경을 갖고 싶다. 지금은 두 가지 배경을 모두 가지고 있지만 맨 아래 배경에는 그 위에 반복되는 y 배경으로 "덮어 버린"그라데이션이 있습니다.

Answer 1

가장 쉬운 방법은 현재 사용중인 <div>을 추가하는 것입니다. <div>의 높이를 90 %로 설정하고 배경을 안에 <div> 대신 할당하십시오.

HTML

<div id="outer-div"> 
    <div id="inner-div">...content...</div> 
</div> 

CSS

/* example outer div */ 
#outer-div 
{ 
    height:500px; /* This is an example rule */ 
    width: 200px; /* This is an example rule */ 
} 

#inner-div 
{ 
    height:90%; 
    background:#000; 
} 

Answer 2

그것은 단지 하나 개의 사업부 사용 CSS3 여러 배경을 만들 수 있습니다 : 당신의 상단 이미지를 반복

background: 
    url(bottom.png) no-repeat,  /* On top, like z-index: 2; */ 
    url(top.png) repeat-y,   /*   like z-index: 1; */ 

를, 하단 이미지 것 이 위에 표시됩니다.