Question

我试图用嵌边边框制作木框架。我制作了一个边框图像并对其应用了插入和常规框阴影。常规阴影可以很好地用作投影。插入阴影被许多像素偏移。出了什么问题，可以修复吗？我试图让插入的阴影直接靠近木框架，而不是远离它的几个像素，直到文本打印的位置。

＆＃13;

.box {
  background: gray;
  color: white;
}
.box-shadow2 {
  border-style: solid;
  border-width: 23px;
  -moz-border-image: url(http://www.cafenocturne.com/images/WoodFrameBrdrImg.png) 23 repeat;
  -webkit-border-image: url(http://www.cafenocturne.com/images/WoodFrameBrdrImg.png) 23 repeat;
  -o-border-image: url(http://www.cafenocturne.com/images/WoodFrameBrdrImg.png) 23 repeat;
  border-image: url(http://www.cafenocturne.com/images/WoodFrameBrdrImg.png) 23 fill repeat;
  -webkit-box-shadow: inset 3px 3px 5px 0px rgba(0, 0, 0, 0.75), 3px 3px 5px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: inset 3px 3px 5px 0px rgba(0, 0, 0, 0.75), 3px 3px 5px 0px rgba(0, 0, 0, 0.75);
  box-shadow: inset 3px 3px 5px 0px rgba(0, 0, 0, 0.75), 3px 3px 5px 0px rgba(0, 0, 0, 0.75);
}

＆＃13;

<div class="box box-shadow2">Text</div>

＆＃13;

Answer 1

您的边框图像只有10像素宽，而不是23.灰色是预期成为图像一部分的额外透明空间。

border-image: url(http://www.cafenocturne.com/images/WoodFrameBrdrImg.png) 10 fill repeat;

有没有办法将边框图像和插入框阴影结合起来？

1 个答案: