Arka Plan resmi olarak servis edilirken SVG Renk Değiştirme doldurmak
SVG çıkış gibi sadece CSS ile dolgu renklerini değiştirmek mümkün duyuyorum sayfa kodunu doğrudan satır içi yerleştirme:
path.mystar {
fill: blue;
}
path.mycircle {
fill: green;
}
Bu işleri bir şekilde değiştirmek için arıyorum ancak büyük, "dolgu" olarak sunulan bir SVG özniteliği arka PLAN resmi.
html {
background-image: url(../img/bg.svg);
}
Nasıl renkleri değiştirebilir miyim? Hatta mümkün mü?
Başvuru için, burada dış SVG dosyası içeriğini
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="320px" height="100px" viewBox="0 0 320 100" enable-background="new 0 0 320 100" xml:space="preserve">
<polygon class="mystar" fill="#3CB54A" points="134.973,14.204 143.295,31.066 161.903,33.77 148.438,46.896 151.617,65.43 134.973,56.679
118.329,65.43 121.507,46.896 108.042,33.77 126.65,31.066 "/>
<circle class="mycircle" fill="#ED1F24" cx="202.028" cy="58.342" r="12.26"/>
</svg>
CEVAP
Bunu yapmak için tek yolu sunucu tarafında çözüm tür sizin svg server için olduğunu düşünüyorum. Sadece svg parametreleri göre verir, bir kaynak sunucu tarafı oluşturmak ve belirli bir url üzerine çekersin.
O zaman sadece css url kullanın.
Bir arka plan ımg çünkü, DOM parçası değil ve bunu değiştiremezsiniz. Başka bir olasılık olurdu için kullanmak düzenli olarak, gömmek bir sayfa normal bir şekilde, ama pozisyon kesinlikle, tam genişlik ve yükseklik bir sayfa ve z-index css özelliği koymak arkasında tüm diğer DOM öğeleri bir sayfa.
Nasıl arka plan resmi bir div doldurma...
UİTabBar / arka Plan rengini değiştirm...
Giriş arka plan kaldırma Chrome otomat...
'in Paket explorer arka plan reng...
Şeffaf olarak düğme arka plan...