边框背景图片

我有背景图片和身体边框。我现在这个样子（上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

也许是我没有很好地描述，我想图像将在边境的顶部，而不是关闭或近。我可以向右移动，左转换位置，但它保持在边界之下。我添加了期望的结果。 – Ikrom

@bob我更新了答案 – Danield

太好了，我已经使用'：after'和'：before'。我有4个角落，我已经把他们中的2个：after和：before（因此其中2个没有角落图像）。我正在寻找另一种没有伪元素的方式。 – Ikrom

试试这个CSS属性使用图像边界

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

非常有趣的事情.. :) –

边框背景图片

回答

相关问题