배경색이 오른쪽 상단의 이미지로 표시하려고합니다.

배경색이 여러 개인 위치 이미지와 배경색이 투명하고 이미지가 투명하고 가장자리를 제거 할 수 있는지 궁금합니다. 이미지가 투명한 색상.배경색이 오른쪽 상단의 이미지로 표시하려고합니다.

나는 현재이 Image을 얻습니다.

그리고 Image과 같은 것을 얻고 싶습니다.

P. 링크로 이미지를 게시하는 것에 유감 스럽지만이 게시 시점에 실제로 이미지를 게시 할 수 없었습니다.

웹 페이지 : desertednoir.uhostfull.com

관련 코드 :

#content { 
    padding: 1.5%; 
    float: left; 
    width: 73%; 
    text-align: center; 
    z-index: 1; 
    color: Silver; 
    border: 1px solid black; 
    background: url("/images/e_bl.png") no-repeat left bottom, 
    url("/images/e_tr.png") no-repeat right top, 
    url("/images/e_tc.png") no-repeat center top, 
    url("/images/e_br.png") no-repeat right bottom, 
    #3C3C3C; 
}

< 사업부 아이디 = "내용"> 컨텐츠 물건 </DIV >

출처

2012-12-03 Zbee

HTML과 CSS는 혼자가 아닙니다 투명한 픽셀을 추가하거나 제거하기 위해 이미지를 편집하기에 충분합니다. 그러나 그들에게 말하지 않는 한 은 색을 더하지 않습니다. 에이 없으므로 요소에 background-color이 지정되어 있고 투명하게 유지됩니다.

예제 코드를 http://jsfiddle.net/XQumV/에 입력했습니다. 위에서 볼 수 있듯이 background 규칙의 끝에서 , #3C3C3C을 제거하면 요소가 투명 해집니다.

HTML의 요소는 기본적으로 사각형이기 때문에 배경색도 항상 사각형입니다. background-image을 사용하여 복잡한 배경 이미지를 얻는 대신 border-image을 사용해보세요. 자세한 내용은 https://developer.mozilla.org/en-US/docs/CSS/border-image을 참조하십시오.

출처

2012-12-03 20:06:12 KatieK

JavaScript 등을 사용하여 문제를 해결하는 것이 좋습니다. 또한 내가 사용하는 유일한 이미지가 20x20px와 같고 내용 요소의 구석에 할당되었으므로 배경색이 지정되었습니다. – Zbee

귀하의 질문에 모든 관련 HTML 및 CSS를 게시하십시오. – KatieK

네, 도와 줘서 고마워. – Zbee

배경색이 오른쪽 상단의 이미지로 표시하려고합니다.

답변

관련 문제