국경의 배경 이미지

본문에는 배경 이미지와 테두리가 있습니다. 나는 (jsbin에) 지금과 같이 :국경의 배경 이미지

enter image description here

그러나 나는 배경 이미지가 국경에 남아, 그래서 배경 이미지가 완전히 볼 수 있습니다합니다. 국경에 배경 이미지를 두는 법?

편집

원하는 결과 :
enter image description here

EDIT2
이미 사용했습니다 : 후 : 같은 @Danield 제공하고 일을하기 전에. 나는 4 개의 코너를 가지고 있고 그것들 중 2 개를 after와 : before (그래서 2 개는 코너 이미지없이 남겨둔다.)와 함께 넣었다. 의사 요소가없는 다른 방법을 찾고 있습니다. 또한 배경이있는 블록 요소를 배치하지 않습니다. 나는 CSS에 의해 성취하려고 노력하고있다.

출처

2014-02-20 Ikrom

절대적으로 위치한 의사 요소를 추가하십시오.

body:after{ 
    content: ''; 
    display:block; 
    background-image: url("https://www.gravatar.com/avatar/97adf5e1abeb6454d6c6a6a39b81265a?s=96&d=identicon&r=PG"); 
    background-position: 0 0; 
    background-repeat: no-repeat; 
    width: 96px; 
    height: 96px; 
    position: absolute; 
    z-index:1; 
    top: 8px; 
    left: 8px; 
}

Updated JsBin

출처

2014-02-20 10:53:31 Danield

어쩌면 내가 잘 설명하지 않았다 경계에 이미지를 사용하려면이 CSS 속성을 시도 가까운. 나는 오른쪽으로 움직일 수 있고, 변화하는 자세로 떠났지만, 그것은 국경 밑에 머무른다. 원하는 결과를 추가했습니다. – Ikrom

@bob 대답을 – Danield

으로 업데이트했습니다. 이미': after'와': before'를 사용했습니다. 나는 4 개의 코너를 가지고 있고 그것들 중 2 개를 after와 : before (그래서 2 개는 코너 이미지없이 남겨둔다.)와 함께 넣었다. 의사 요소가없는 다른 방법을 찾고 있습니다. – Ikrom

나는 이미지의 경계 위에 가까이하지 않거나에있을 것입니다 원하는,

border-image: url(https://www.gravatar.com/avatar/97adf5e1abeb6454d6c6a6a39b81265a?s=96&d=identicon&r=PG) 25% repeat;

출처

2014-02-20 11:00:16

여기에 링크가 있습니다. http://jsbin.com/nokibewi/8/edit –

경계 색을 재정의합니다. 나는 경계와 배경 이미지를 모두 지킬 필요가있다. – Ikrom

아주 흥미로운 것. :) –

국경의 배경 이미지

답변

관련 문제