modifiers imgタグでCSSを埋めてください

Question

私のSVGの色を変更したいのですが、彼はimgタグでリンクされています。ここ は私のコードですが、彼はobject方法がない

MY CSSファイル

.viewing_instructions_img:hover { 
    fill: #FD7861; 
} 

私のHTMLファイル

<img src="yo.svg"> 

MY SVGファイル

<?xml version="1.0" encoding="iso-8859-1"?> 
    <!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> 
    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 
    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="512px" height="512px" viewBox="0 0 438.533 438.533" style="enable-background:new 0 0 438.533 438.533;" xml:space="preserve"> 
    <g> 
     <g> 
      <path class="viewing_instructions_img" d="M409.133,109.203c-19.608-33.592-46.205-60.189-79.798-79.796C295.736,9.801,259.058,0,219.273,0 c-39.781,0-76.47,9.801-110.063,29.407c-33.595,19.604-60.192,46.201-79.8,79.796C9.801,142.8,0,179.489,0,219.267 c0,39.78,9.804,76.463,29.407,110.062c19.607,33.592,46.204,60.189,79.799,79.798c33.597,19.605,70.283,29.407,110.063,29.407 s76.47-9.802,110.065-29.407c33.593-19.602,60.189-46.206,79.795-79.798c19.603-33.596,29.403-70.284,29.403-110.062 C438.533,179.485,428.732,142.795,409.133,109.203z M353.742,297.208c-13.894,23.791-32.736,42.64-56.527,56.534 c-23.791,13.894-49.771,20.834-77.945,20.834c-28.167,0-54.149-6.94-77.943-20.834c-23.791-13.895-42.633-32.743-56.527-56.534 c-13.897-23.791-20.843-49.772-20.843-77.941c0-28.171,6.949-54.152,20.843-77.943c13.891-23.791,32.738-42.637,56.527-56.53 c23.791-13.895,49.772-20.84,77.943-20.84c28.173,0,54.154,6.945,77.945,20.84c23.791,13.894,42.634,32.739,56.527,56.53 c13.895,23.791,20.838,49.772,20.838,77.943C374.58,247.436,367.637,273.417,353.742,297.208z" fill="#333333"/> 
      <path class="viewing_instructions_img" d="M328.911,203.561l-155.32-91.36c-5.896-3.617-11.991-3.711-18.271-0.284c-6.09,3.615-9.136,8.942-9.136,15.984v182.725 c0,7.04,3.046,12.371,9.136,15.985c3.046,1.522,6.09,2.286,9.135,2.286c3.234,0,6.283-0.856,9.136-2.567l155.32-91.361 c6.088-3.426,9.134-8.661,9.134-15.699C338.045,212.23,334.992,206.988,328.911,203.561z" fill="#333333"/> 
     </g> 
</g> 
</svg> 

Answer 1

を動作しません。外部スタイルシートで作業します。

[...]あなたがCSSのものが仕事をしたい場合は、あなたが外部 スタイルシートを使用したり、文書にすることはできません、あなたはSVGファイル自体の内部 要素を使用する必要があります。

SVGファイルの中にCSSを入れてスタイルを設定できます。

<style type="text/css"> 
path{ 
    fill: red; 
    } 
</style>