Изменение цвета заливки в SVG

Я хотел бы изменить цвет заливки моего SVG изображения, но это, кажется, не работает ...Изменение цвета заливки в SVG

Мой код:

&:after { 
    content: ''; 
    display: block; 
    position: absolute; 
    top: 0; 
    right: 0; 
    height: 50px; 
    width: 50px; 
    background-color: blue; 
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI1MTJweCINCgkgaGVpZ2h0PSI1MTJweCIgdmlld0JveD0iMCAwIDUxMiA1MTIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGcgaWQ9IkNhbHF1ZV8xIiBkaXNwbGF5PSJub25lIj4NCgk8ZyBkaXNwbGF5PSJpbmxpbmUiPg0KCQk8cGF0aCBkPSJNMjY3LjY0NiwxNDcuNzM2Yy02LjM3OS01LjQ4Mi0xNi44NzctNS40ODItMjAuMzcxLDBMODguODI4LDI4My41NjljLTkuMjIxLDUuNDktMTQuNTIxLDE2Ljg2OC0xNC41MjEsMjUuMjg3djE2MS4yODkNCgkJCWMwLDguNDQ2LDYuOTI4LDE1LjMyMywxNS4zNDgsMTUuMzIzaDg3LjM5OWM4LjQyMSwwLDE1LjMyMS02Ljg3NSwxNS4zMjEtMTUuMzIzVjMzMi45NzJjMC04LjQzNyw2Ljg4OC0xNS4zMjEsMTUuMzYxLTE1LjMyMQ0KCQkJaDk5LjE3NWM4LjQzNSwwLDE1LjM1LDYuODg3LDE1LjM1LDE1LjMyMXYxMzcuMTc0YzAsOC40NDcsNi44NzIsMTUuMzIzLDE1LjMyMSwxNS4zMjNoODQuNzQ2YzguNDQ2LDAsMTUuMzc2LTYuODc0LDE1LjM3Ni0xNS4zMjMNCgkJCVYzMDguODMyYzAtOC40NDUtNS4zMDMtMTkuODI1LTExLjY1OC0yNS4zMTNMMjY3LjY0NiwxNDcuNzM2eiIvPg0KCQk8cGF0aCBkPSJNNTAwLjgxNCwyMjkuODQ1bC02MS45NTMtNTMuMzk1VjczLjg3NGMwLTguNDI5LTYuODU5LTE1LjMxMy0xNS4zMS0xNS4zMTNoLTM5LjMyOGMtOC40NDQsMC0xNS4zMSw2Ljg4NS0xNS4zMSwxNS4zMTMNCgkJCXY0Mi4yMzhsLTkyLjA4Ni03OS4zOThjLTExLjgzLTEwLjcyNi0yOS43OS0xMC43MjYtNDEuNzAyLDBMMTEuMTQsMjI5Ljg0NWMtMTIuNjQ0LDExLjUyOS0xMy42MDMsMzEuMTQ1LTIuMDkyLDQzLjgxMw0KCQkJYzYuMDc2LDYuNzY5LDI5LjQwNSwxNi41NDYsNDMuODA3LDIuMTMyTDI1NS45OSwxMDEuNTg0bDIwMy4xNjIsMTc0LjE3OWMxMi42MzIsMTEuNTIyLDMyLjIyOSwxMC41NzYsNDMuODA3LTIuMTA0DQoJCQlDNTE0LjQ2OSwyNjAuOTg4LDUxMy41MSwyNDEuMzc0LDUwMC44MTQsMjI5Ljg0NXoiLz4NCgk8L2c+DQo8L2c+DQo8ZyBpZD0iQ2FscXVlXzIiPg0KCTxnPg0KCQk8dGV4dCB0cmFuc2Zvcm09Im1hdHJpeCgxIDAgMCAxIDEuNDE4IDM1NC4zMDgzKSIgZm9udC1mYW1pbHk9IidNeXJpYWRQcm8tUmVndWxhciciIGZvbnQtc2l6ZT0iMzM0LjI2NTkiPi88L3RleHQ+DQoJCTxwYXRoIGQ9Ik0yMjcuOTQ4LDMxOC41NTVjMCwyMy42MTMtMTkuMTQsNDIuNzYyLTQyLjc3Myw0Mi43NjJjLTIzLjYyMywwLTQyLjc2My0xOS4xNDgtNDIuNzYzLTQyLjc2Mg0KCQkJYzAtMjMuNjEyLDE5LjE0LTQyLjc2Myw0Mi43NjMtNDIuNzYzQzIwOC44MDgsMjc1Ljc5MywyMjcuOTQ4LDI5NC45NDMsMjI3Ljk0OCwzMTguNTU1eiIvPg0KCQk8cGF0aCBkPSJNMzY5LjkxMywzMTguNTM0YzAsMjMuNjM1LTE5LjE1LDQyLjc2Mi00Mi43ODUsNDIuNzYyYy0yMy42MzQsMC00Mi43NjMtMTkuMTI3LTQyLjc2My00Mi43NjINCgkJCWMwLTIzLjYzNCwxOS4xMjktNDIuNzY0LDQyLjc2My00Mi43NjRDMzUwLjc2MywyNzUuNzcsMzY5LjkxMywyOTQuOSwzNjkuOTEzLDMxOC41MzR6Ii8+DQoJCTxwYXRoIGQ9Ik01MTEuODksMzE4LjUzNGMwLDIzLjYzNS0xOS4xNSw0Mi43NjItNDIuNzYzLDQyLjc2MmMtMjMuNjEzLDAtNDIuNzY0LTE5LjEyNy00Mi43NjQtNDIuNzYyDQoJCQljMC0yMy42MzQsMTkuMTUtNDIuNzY0LDQyLjc2NC00Mi43NjRDNDkyLjczOSwyNzUuNzcsNTExLjg5LDI5NC45LDUxMS44OSwzMTguNTM0eiIvPg0KCTwvZz4NCjwvZz4NCjwvc3ZnPg0K); 
    background-size: 50px 50px; 
    background-position: center; 
    background-repeat: no-repeat; 
    fill: red; // not working 
}

источник

2016-03-08 tonymx227

Отредактируйте цвет заливки в изображении самого URL. –

http://stackoverflow.com/questions/13367868/modify-svg-fill-color-when-being-served-as-background-image – fcalderan

вы устанавливаете заливку на : после того, как не на SVG, чтобы управлять SVG, вам нужно добавить его как элемент изображения, а затем настроить его с помощью css

источник

2016-03-08 10:56:02

Изменение цвета заливки в SVG

ответ

Смежные вопросы