修改外部SVG使用CSS，容器

Question

裏面我有這樣的事情：

<div class="container"> 
    <embed src="files/image.svg" type="image/svg+xml" id="my-svg" /> 
    <h1>Title</h1> 
    <h2>Sub title</h2> 
</div> 

加上一個樣式，style.css，在我的HTML文件被引用，與像這樣的外部SVG文件一起：

<?xml-stylesheet type="text/css" href="style.css"?> 

我想要做的是當容器翻轉時更改SVG的填充。這是純粹的CSS可能嗎？

我知道可以在CSS中做這樣的事情;

rect:hover { 
    fill: white; 
} 

但是，是否有可能沿着這條線做點什麼？

.container:hover rect { 
    fill: white; 
} 

乾杯！

Answer 1

修正了一個答案的問題，從Drew Baker

How to change color of SVG image using CSS (jQuery SVG image replacement)?

原來你必須使SVG 「看得見」 的DOM。

Answer 2

你可以使用jQuery。簡單地

$('.container').mouseover(function(){ 

    $('rect').css('fill', 'white'); 


});