CSS图像边框透明度/颜色问题

我想制作一个很酷的div，所以我制作了这个图像来获取它的边框：

问题是一半的边框是透明区域，所以当我尝试用背景色填充div的空白中心时，它也会绘制外部的透明区域。我希望背景色不要越过边界

下面是我要说的：

@charset“utf-8”；
/*CSS文档*/
#testDiv{
边框图像源：url(https://s9.postimg.org/40j461sf3/Div_Sprite.png);
边界图像切片：50%25%25%；
边界图像重复：重复；
边框图像宽度：自动；
边界图像重复：圆形；
背景色：红色；
最小高度：600px；
宽度：600px；
}
#身体{
身高：100%；
宽度：100%；
背景：#CCC；
位置：绝对位置；
利润率：50px0；
}

---

也许我弄错了，但您可以尝试使用

边框图像开始

和

边距

属性

float:left;
margin:50px 20px;
border-image-source:url(http://s9.postimg.org/40j461sf3/Div_Sprite.png);
border-image-slice: 50% 25% 25%;
border-image-repeat:repeat;
border-image-width:auto;
border-image-repeat:round;
background-color: red;
border-image-outset:30px;

---

该死，这正是我需要的。非常感谢。嗯，我不知道边界图像xxx的细节，我在W3学校找到了答案：）