Затенение SVG css без нежелательной границы - PullRequest
Новая
       23

Затенение SVG css без нежелательной границы

0 голосов
/ 01 апреля 2019

Вот мой код SVG, когда я добавляю тень фильтра CSS на графике есть нежелательная тень от границы, но я не вижу здесь фрагмента. никто не может сказать, что происходит?

the result on my end

.shadow {
	-webkit-filter: drop-shadow(0px 3px 10px rgba(0,0,0,.8));
    filter: drop-shadow(0px 0px 10px rgba(0,0,0,.8));
    fill:white;
}
<div style="background:gray; height:500px;">
<svg version="1.1" id="Layer_1" width=300px class="shadow" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 56.69 56.69"  xml:space="preserve">
<g>
	<path d="M32.61,29.55V22.8c0-0.42-0.35-0.77-0.77-0.77h-2.53V7.13h3.21c1.22,0,3.67-2.38,3.67-5.53c0-0.42-0.35-0.77-0.77-0.77
		H22.08l-0.64,0.03c-0.41,0.02-0.73,0.36-0.73,0.77c0,2.89,2.14,5.16,2.23,5.27c0.14,0.15,0.35,0.24,0.56,0.24h4.25v14.89h-2.52
		c-0.42,0-0.77,0.35-0.77,0.77v6.74c-2.08,1.36-3.36,3.69-3.36,6.18c0,4.09,3.34,7.42,7.42,7.42s7.41-3.34,7.41-7.42
		C35.96,33.24,34.68,30.92,32.61,29.55z M23.86,5.59c-0.4-0.5-1.29-1.73-1.53-3.2h12.26c-0.31,1.89-1.69,3.09-2.1,3.2H23.86z
		 M26.02,23.57h5.05v5.8h-5.05V23.57z M28.55,41.6c-3.24,0-5.88-2.63-5.88-5.88c0-1.92,0.96-3.71,2.52-4.8
		c0.02,0,0.03,0.01,0.05,0.01h6.6c0.02,0,0.03-0.01,0.04-0.01c1.57,1.09,2.53,2.88,2.53,4.8C34.41,38.96,31.78,41.6,28.55,41.6z"/>
	<path d="M30.76,44.45c-0.42,0.04-0.73,0.42-0.69,0.85l0.92,9.01h-5.36l0.39-9.07c0.02-0.42-0.31-0.78-0.74-0.81
		c-0.44-0.03-0.78,0.31-0.81,0.74l-0.43,9.87c-0.01,0.21,0.07,0.41,0.22,0.57c0.14,0.15,0.35,0.24,0.56,0.24h7.02
		c0.22,0,0.42-0.09,0.58-0.26c0.14-0.17,0.22-0.38,0.2-0.6l-1.01-9.87C31.56,44.71,31.17,44.4,30.76,44.45z"/>

</g>
</svg>
</div>

1 Ответ

0 голосов
/ 01 апреля 2019

Я обнаружил проблему! в конце концов я использовал .shadow, имя которого совпадает с атрибутом стиля начальной загрузки, поэтому он также запускает стиль начальной загрузки.

...