2014-03-26 3 views
-1

테두리 이미지 태그를 사용하여 CSS로 맞춤 테두리를 만듭니다. 사용중인 배경색이 테두리와 같은 색상입니다. 그러나 그것은 전체 높이를 채우지 못합니다.맞춤 테두리 CSS 및 배경 이미지

<!DOCTYPE html> 
<html> 
<head> 
<style> 

div{ 
border:15px solid transparent; 
width:250px; 
} 

div p { 
background-color: #74c7a9; 
padding-right: 20px; 
padding-bottom: 20px; 
} 


#round { 
-webkit-border-image:url(border2.png) 30 30 round; /* Safari 5 */ 
-o-border-image:url(border2.png) 30 30 round; /* Opera */ 
border-image:url(border2.png) 30 30 round; 
} 

</style> 
</head> 
<body> 


<div id="round"> 
    <p>Here, the image is tiled (repeated) to fill the area. 
    </p> 
</div> 

</body> 
</html> 

답변

0

당신은 페이지의 배경 및 사업부 국경 사이에 볼 수있는 공간이 페이지의 여백 (위쪽과 아래쪽)입니다. 이 방법은 너무 작은 얻을 수 있다고 생각하는 경우

당신은

p { 
    margin: 0px; 
} 

로를 설정할 수 있습니다, 사업부의 배경을 설정, 그렇지 않으면 (쉽게 할 수있다),

p { 
    padding-top: 20px; 
} 

을 추가하거나 p 안에 있지 않다