SCSS/SASS Динамическое фоновое изображение на основе имени класса ⇐ CSS

[Anonymous]

Я искал «нахальный» способ сделать что-то вроде этого: < /pt>
.btn-save {
background: image-url('save.svg');
}

.btn-load {
background: image-url('load.svg');
}

.btn-back {
background: image-url('back.svg');
}
< /code>
Есть ли способ взять последнюю часть имени класса и передать его функции для загрузки соответствующего значка SVG? Я думал, что это будет выглядеть примерно так: < /p>
@function load-svg($svg-name) {
background: image-url($svg-name + ".svg");
}

.btn-* {
// I'm not sure how to get the $svg-name here
load-svg($svg-name);
}


Подробнее здесь: https://stackoverflow.com/questions/569 ... class-name