问题描述
代码是 reactJS 项目的一部分。 SVG的多边形如下:
return ( <div>
<svg width={this.state.width} height={this.state.height} viewBox={"0 0 "+this.state.width+" "+this.state.height} xmlns="http://www.w3.org/2000/svg">
<path onClick={e=>this.getMenu(e)} d={"M "+this.state.width/2+" 0 l -10 20 l 20 0 z"} stroke="green" stroke-width="3" fill="green" />
<path d={"M "+this.state.width/2+" 0 l -10 20 l 20 0 z"} stroke="green" stroke-width="3" fill="none" transform={"rotate(180 "+this.state.width/2+" "+10+")"}/>
<polygon points={this.state.polygon1} stroke="none" stroke-width="10" fill="#BBB" opacity="0.8"/>
<defs>
<linearGradient id="grad" x2="0" y2="1">
<stop offset="0" stop-color="#BBB"/>
<stop offset="1" stop-color="#FFF"/>
</linearGradient>
</defs>
<polygon className="curtain" points={this.state.polygon}/>
</svg>
</div> );
对应的CSS如下:
.curtain{
margin-top: 1em;
stroke-width: 0;
stroke: aliceblue;
-moz-Box-shadow: 0 4px 2px -2px gray;
-webkit-Box-shadow: 0 4px 2px -2px gray;
Box-shadow: 0 4px 2px -2px gray;
fill: url(#grad);
}
但是当 css 的其他属性正常时,Box-shadow 不起作用。有人可以在这方面帮忙指出错误吗?
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)