html
<img src="logo.svg" alt="logo" class="logo-img">
css
.logo-img path { fill: #000; }
上面的svg加载和本机填充：#fff但当我使用上面的CSS尝试改变它的黑色它不会改变，这是我第一次玩SVG，我不知道为什么它不工作。
解决方法
您需要使SVG成为内联SVG。您可以使用此脚本，通过向图像添加类svg：
/*
* Replace all SVG images with inline SVG
*/
jQuery('img.svg').each(function(){
var $img = jQuery(this);
var imgID = $img.attr('id');
var imgClass = $img.attr('class');
var imgURL = $img.attr('src');
jQuery.get(imgURL,function(data) {
// Get the SVG tag,ignore the rest
var $svg = jQuery(data).find('svg');
// Add replaced image's ID to the new SVG
if(typeof imgID !== 'undefined') {
$svg = $svg.attr('id',imgID);
}
// Add replaced image's classes to the new SVG
if(typeof imgClass !== 'undefined') {
$svg = $svg.attr('class',imgClass+' replaced-svg');
}
// Remove any invalid XML tags as per http://validator.w3.org
$svg = $svg.removeAttr('xmlns:a');
// Check if the viewport is set,if the viewport is not set the SVG wont't scale.
if(!$svg.attr('viewBox') && $svg.attr('height') && $svg.attr('width')) {
$svg.attr('viewBox','0 0 ' + $svg.attr('height') + ' ' + $svg.attr('width'))
}
// Replace image with new SVG
$img.replaceWith($svg);
},'xml');
});
然后，现在如果你做：
.logo-img path { fill: #000; }
或者可能：
.logo-img path { background-color: #000; }
这工作！
小提琴：http://jsfiddle.net/wuSF7/462/
上述脚本的积分：How to change color of SVG image using CSS (jQuery SVG image replacement)?
