In a SVG document, I want to make a <path>
-element transparent. I tried <path fill="transparent />"
but this gives me a black surface in ie8 (which is the default color for unknown values). I use SVGweb to display the SVG in ie8. How do I make it appear transparent in ie8?
EDIT:
According to the SVG-SPEC ( http://www.w3.org/TR/SVG/painting.html#SpecifyingPaint ), the attribute fill
takes a value of type <paint>
. the value currentColor
does work in ie8, yet it's not supported by ff and chrome.
So I'd like to reshape my question: How do I make it appear transparent in ff, chrome and ie8 simultaneously?
The SVG fill-opacity CSS property is used to set the opacity of the fill color of a shape. The fill-opacity takes a decimal number between 0 and 1. The closer to 0 the value is, the more transparent the fill is. The closer to 1 the value is, the more opaque the fill is.
SVG supports animation, transparency, gradients, and is easily scalable without losing quality. PNG is a raster image format used for full-color images (mostly photos) in good quality. It has a rather high compression ratio and supports transparency.
In SVG, you can specify that any other graphics object or 'g' element can be used as an alpha mask for compositing the current object into the background. A mask is defined with a 'mask' element.
You use an addtional attribute; fill-opacity : This attribute takes a decimal number between 0.0 and 1.0, inclusive; where 0.0 is completely transparent.
fill="none"
Or you can cheat (and hurt performance) with:
fill-opacity="0"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With