Question

请在此jsfidle-example中查看我的示例。

<div class="border background" style="width:200px; height:200px"> </div>
.border
{
  border-style: solid;
  border-width: 17px 7px 5px 10px;
  -o-border-image:url(image1)  17 7 5 10 repeat;
  -moz-border-image: url(image1)  17 7 5 10 repeat;
  border-image: url(image1) 17 7 5 10 fill repeat;

}
.background
{
  content: url(image2);
}

我的图像位于border-image内，

外边框图像有一个形状，里面的图像是正方形，

我希望图像填充边框图像的整个边框（就像遮住内部图像一样）。

我该怎么做？

Answer 1

你看起来像这样吗？

 <div class="border" style="width:200px; height:200px">
    <div class="background" style="width:204px; height:215px;"></div> 
 </div>

Fiddle Demo

css边框图像和背景图像遮罩

1 个答案: