使用CSS 3的SVG丟棄陰影是否可以使用CSS 3為SVG元素設(shè)置拖放陰影,例如box-shadow: -5px -5px 5px #888;-webkit-box-shadow: -5px -5px 5px #888;我看到了一些關(guān)于使用過濾器效果創(chuàng)建陰影的注釋。是否有單獨使用CSS的例子。下面是正確應(yīng)用緩沖樣式的工作代碼,但沒有陰影效果。請幫助我得到陰影效果,至少一點代碼。svg .shadow { cursor:crosshair; -moz-box-shadow: -5px -5px 5px #888; -webkit-box-shadow: -5px -5px 5px #888; box-shadow: -5px -5px 5px #888; } <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="full" viewBox="0 0 120 70"> <rect class="shadow" x="10" y="10" width="100" height="50" fill="#c66" /></svg>
3 回答

收到一只叮咚
TA貢獻(xiàn)1821條經(jīng)驗 獲得超5個贊
slope
<filter id="dropshadow" height="130%"> <feGaussianBlur in="SourceAlpha" stdDeviation="3"/> <!-- stdDeviation is how much to blur --> <feOffset dx="2" dy="2" result="offsetblur"/> <!-- how much to offset --> <feComponentTransfer> <feFuncA type="linear" slope="0.5"/> <!-- slope is the opacity of the shadow --> </feComponentTransfer> <feMerge> <feMergeNode/> <!-- this contains the offset blurred image --> <feMergeNode in="SourceGraphic"/> <!-- this contains the element that the filter is applied to --> </feMerge></filter><circle r="10" style="filter:url(#dropshadow)"/>
- 3 回答
- 0 關(guān)注
- 683 瀏覽
添加回答
舉報
0/150
提交
取消