如何将框阴影应用于带有轮廓的文本外部？

Question

我有一个按照我想要的方式概述的文本块。现在我想要围绕该轮廓的阴影效果。当我应用一个盒子阴影时，它会影响我不想要的线条。有没有办法只适用于外圈？

https://jsfiddle.net/6nrzkodu/

div span{
  font-weight:bold;
  outline: 2px solid green;
  box-shadow: 2px 2px 5px;
}

以下是我正在寻找的文字之外的阴影片段：

Answer 1

只需将display：block添加到元素中，因此它仍然是内联的，但现在它是一个元素块。 您可能希望使用<mark>代替<span>。对于HTML语义等等...... 干杯;）

div span{
  font-weight:bold;
  outline: 2px solid green;
  box-shadow: 2px 2px 5px;
  display:inline-block;

}

Answer 2

所以你想要一个围绕块的轮廓？

尝试将其显示为内联块：

div span{
  font-weight:bold;
  outline: 2px solid green;
  box-shadow: 2px 2px 5px;
  display: inline-block;
}