有没有办法翻转盒子阴影？

Question

目前我正在制作一些pixelart的东西，它制作3＆＃34;图像＆＃34;，div为1，盒子阴影为1，svg为1。

由于一个或多个原因，我不能用这个来翻转盒子阴影：

element {
        -moz-transform: scaleX(-1);
        -o-transform: scaleX(-1);
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
        filter: FlipH;
        -ms-filter: "FlipH";
}

示例：

＆＃13;

＆＃13;

body {
  background-color: rgba(255, 0, 180, 0.4);
}
.girl,
.girl > div {
  display: inline-block;
  font-size: 0;
}
.girlS:before {
  content: "";
  width: 9px;
  height: 9px;
  position: absolute;
  box-shadow: 27px 0px #000000, 36px 0px #000000, 45px 0px #000000, 54px 0px #000000, 63px 0px #000000, 9px 9px #000000, 18px 9px #000000, 27px 9px #000000, 36px 9px #000000, 45px 9px #000000, 54px 9px #000000, 63px 9px #000000, 72px 9px #000000, 9px 18px #000000, 18px 18px #000000, 27px 18px #000000, 36px 18px #000000, 45px 18px #ffe0bd, 54px 18px #ffe0bd, 63px 18px #000000, 72px 18px #000000, 81px 18px #000000, 0px 27px #000000, 9px 27px #000000, 18px 27px #000000, 27px 27px #000000, 36px 27px #ffe0bd, 45px 27px #ffe0bd, 54px 27px #ffe0bd, 63px 27px #ffe0bd, 72px 27px #000000, 81px 27px #000000, 0px 36px #000000, 9px 36px #000000, 18px 36px #000000, 27px 36px #ffe0bd, 36px 36px #ffe0bd, 45px 36px #675636, 54px 36px #ffe0bd, 63px 36px #675636, 72px 36px #ffe0bd, 81px 36px #000000, 0px 45px #000000, 9px 45px #000000, 18px 45px #000000, 27px 45px #ffe0bd, 36px 45px #ffe0bd, 45px 45px #ffe0bd, 54px 45px #ffe0bd, 63px 45px #ffe0bd, 72px 45px #ffe0bd, 81px 45px #000000, 0px 54px #000000, 9px 54px #000000, 18px 54px #000000, 27px 54px #000000, 36px 54px #ffe0bd, 45px 54px #ffe0bd, 54px 54px #ff0000, 63px 54px #ffe0bd, 72px 54px #000000, 81px 54px #000000, 18px 63px #000000, 27px 63px #000000, 36px 63px #000000, 45px 63px #ffe0bd, 54px 63px #ffe0bd, 63px 63px #000000, 72px 63px #000000, 27px 72px #000000, 36px 72px #ffffff, 45px 72px #ffe0bd, 54px 72px #ffe0bd, 63px 72px #ffffff, 72px 72px #000000, 27px 81px #ffffff, 36px 81px #ffffff, 45px 81px #ffffff, 54px 81px #ffffff, 63px 81px #ffffff, 72px 81px #ffffff, 27px 90px #ffffff, 36px 90px #ffffff, 45px 90px #ffffff, 54px 90px #ffffff, 63px 90px #ffffff, 72px 90px #ffffff, 27px 99px #ffe0bd, 36px 99px #ffffff, 45px 99px #ffffff, 54px 99px #ffffff, 63px 99px #ffffff, 72px 99px #ffe0bd, 27px 108px #ffe0bd, 36px 108px #ffffff, 45px 108px #ffffff, 54px 108px #ffffff, 63px 108px #ffffff, 72px 108px #ffe0bd, 27px 117px #ffe0bd, 36px 117px #ffffff, 45px 117px #ffffff, 54px 117px #ffffff, 63px 117px #ffffff, 72px 117px #ffe0bd, 27px 126px #ffe0bd, 36px 126px #ffffff, 45px 126px #ffffff, 54px 126px #ffffff, 63px 126px #ffffff, 72px 126px #ffe0bd, 36px 135px #ffffff, 45px 135px #ffffff, 54px 135px #ffffff, 63px 135px #ffffff, 45px 144px #ffe0bd, 54px 144px #ffe0bd, 45px 153px #ffe0bd, 54px 153px #ffe0bd, 45px 162px #ffe0bd, 54px 162px #ffe0bd, 45px 171px #000000, 54px 171px #000000;
}
svg {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
}

＆＃13;

Div 14:
<div class="girl" style="width: 140px;">
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(103, 86, 54);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(103, 86, 54);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 255, 255);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(255, 224, 189);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px; background-color: rgb(0, 0, 0);"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
  <div style="width: 14px; height: 14px;"></div>
</div>
box-shadow 9:
<div class="girlS" style="position: relative; display: inline-block; width: 90px; margin-bottom: 180px;"></div>
SVG 5:
<svg class="svgExample" style="width: 50px; height: 100px;">
  <rect x="15" y="0" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="20" y="0" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="25" y="0" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="30" y="0" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="35" y="0" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="5" y="5" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="10" y="5" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="5" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="20" y="5" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="25" y="5" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="30" y="5" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="35" y="5" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="40" y="5" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="5" y="10" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="10" y="10" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="10" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="20" y="10" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="25" y="10" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="10" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="35" y="10" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="40" y="10" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="45" y="10" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="0" y="15" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="5" y="15" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="10" y="15" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="15" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="20" y="15" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="25" y="15" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="15" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="35" y="15" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="40" y="15" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="45" y="15" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="0" y="20" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="5" y="20" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="10" y="20" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="20" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="20" y="20" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="25" y="20" width="5" height="5" fill="rgb(103, 86, 54)"></rect>
  <rect x="30" y="20" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="35" y="20" width="5" height="5" fill="rgb(103, 86, 54)"></rect>
  <rect x="40" y="20" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="45" y="20" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="0" y="25" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="5" y="25" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="10" y="25" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="25" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="20" y="25" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="25" y="25" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="25" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="35" y="25" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="40" y="25" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="45" y="25" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="0" y="30" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="5" y="30" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="10" y="30" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="30" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="20" y="30" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="25" y="30" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="30" width="5" height="5" fill="rgb(255, 0, 0)"></rect>
  <rect x="35" y="30" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="40" y="30" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="45" y="30" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="10" y="35" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="35" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="20" y="35" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="25" y="35" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="35" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="35" y="35" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="40" y="35" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="40" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="20" y="40" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="40" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="40" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="35" y="40" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="40" y="40" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="15" y="45" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="20" y="45" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="45" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="30" y="45" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="35" y="45" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="40" y="45" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="15" y="50" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="20" y="50" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="50" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="30" y="50" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="35" y="50" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="40" y="50" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="15" y="55" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="20" y="55" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="55" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="30" y="55" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="35" y="55" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="40" y="55" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="15" y="60" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="20" y="60" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="60" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="30" y="60" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="35" y="60" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="40" y="60" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="15" y="65" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="20" y="65" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="65" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="30" y="65" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="35" y="65" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="40" y="65" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="15" y="70" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="20" y="70" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="70" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="30" y="70" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="35" y="70" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="40" y="70" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="20" y="75" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="75" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="30" y="75" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="35" y="75" width="5" height="5" fill="rgb(255, 255, 255)"></rect>
  <rect x="25" y="80" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="80" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="25" y="85" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="85" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="25" y="90" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="30" y="90" width="5" height="5" fill="rgb(255, 224, 189)"></rect>
  <rect x="25" y="95" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
  <rect x="30" y="95" width="5" height="5" fill="rgb(0, 0, 0)"></rect>
</svg>

＆＃13;

＆＃13;

＆＃13;

如果我可以帮助我使用THIS UGLY TOOL（不是crossbrowser，只测试并在chrome 47.0.xxxxxxx上使用，那么有一个简单的解决方案（css，jquery，js？）？

非常欢迎任何帮助：D

Answer 1

几个小时后我发现了问题，我指的是：strXXX(x); strXXX(x + 0); strXXX(&x[0]); strXXX(x + 1); strXXX(&x[1]); 而不是element:after（因为盒子阴影在element上）。

非常愚蠢的我，我希望将来对其他人安全。

＆＃13;

＆＃13;

:after

＆＃13;

body {
  background-color: rgba(255, 0, 180, 0.4);
}
.girl,
.girl > div {
  display: inline-block;
  font-size: 0;
}
.girlS:before {
  content: "";
  width: 9px;
  height: 9px;
  position: absolute;
  box-shadow: 27px 0px #000000, 36px 0px #000000, 45px 0px #000000, 54px 0px #000000, 63px 0px #000000, 9px 9px #000000, 18px 9px #000000, 27px 9px #000000, 36px 9px #000000, 45px 9px #000000, 54px 9px #000000, 63px 9px #000000, 72px 9px #000000, 9px 18px #000000, 18px 18px #000000, 27px 18px #000000, 36px 18px #000000, 45px 18px #ffe0bd, 54px 18px #ffe0bd, 63px 18px #000000, 72px 18px #000000, 81px 18px #000000, 0px 27px #000000, 9px 27px #000000, 18px 27px #000000, 27px 27px #000000, 36px 27px #ffe0bd, 45px 27px #ffe0bd, 54px 27px #ffe0bd, 63px 27px #ffe0bd, 72px 27px #000000, 81px 27px #000000, 0px 36px #000000, 9px 36px #000000, 18px 36px #000000, 27px 36px #ffe0bd, 36px 36px #ffe0bd, 45px 36px #675636, 54px 36px #ffe0bd, 63px 36px #675636, 72px 36px #ffe0bd, 81px 36px #000000, 0px 45px #000000, 9px 45px #000000, 18px 45px #000000, 27px 45px #ffe0bd, 36px 45px #ffe0bd, 45px 45px #ffe0bd, 54px 45px #ffe0bd, 63px 45px #ffe0bd, 72px 45px #ffe0bd, 81px 45px #000000, 0px 54px #000000, 9px 54px #000000, 18px 54px #000000, 27px 54px #000000, 36px 54px #ffe0bd, 45px 54px #ffe0bd, 54px 54px #ff0000, 63px 54px #ffe0bd, 72px 54px #000000, 81px 54px #000000, 18px 63px #000000, 27px 63px #000000, 36px 63px #000000, 45px 63px #ffe0bd, 54px 63px #ffe0bd, 63px 63px #000000, 72px 63px #000000, 27px 72px #000000, 36px 72px #ffffff, 45px 72px #ffe0bd, 54px 72px #ffe0bd, 63px 72px #ffffff, 72px 72px #000000, 27px 81px #ffffff, 36px 81px #ffffff, 45px 81px #ffffff, 54px 81px #ffffff, 63px 81px #ffffff, 72px 81px #ffffff, 27px 90px #ffffff, 36px 90px #ffffff, 45px 90px #ffffff, 54px 90px #ffffff, 63px 90px #ffffff, 72px 90px #ffffff, 27px 99px #ffe0bd, 36px 99px #ffffff, 45px 99px #ffffff, 54px 99px #ffffff, 63px 99px #ffffff, 72px 99px #ffe0bd, 27px 108px #ffe0bd, 36px 108px #ffffff, 45px 108px #ffffff, 54px 108px #ffffff, 63px 108px #ffffff, 72px 108px #ffe0bd, 27px 117px #ffe0bd, 36px 117px #ffffff, 45px 117px #ffffff, 54px 117px #ffffff, 63px 117px #ffffff, 72px 117px #ffe0bd, 27px 126px #ffe0bd, 36px 126px #ffffff, 45px 126px #ffffff, 54px 126px #ffffff, 63px 126px #ffffff, 72px 126px #ffe0bd, 36px 135px #ffffff, 45px 135px #ffffff, 54px 135px #ffffff, 63px 135px #ffffff, 45px 144px #ffe0bd, 54px 144px #ffe0bd, 45px 153px #ffe0bd, 54px 153px #ffe0bd, 45px 162px #ffe0bd, 54px 162px #ffe0bd, 45px 171px #000000, 54px 171px #000000;
}
.girlS {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
}

＆＃13;

＆＃13;

＆＃13;