Bymas | чет не работает base64

не могу запелить где не правильно ? в гугле искал решение , у многих такая беда что не пашет .

css

   .buttons a::before { content: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAChJREFUOE9jZKAyYKSyeQyjBlIeoqNhOBqGZITAaLIhI9DQtIzAMAQASMYAFTvklLAAAAAASUVORK5CYII'); }

Вроде все правильно, но сама картинка в коде выше - это просто прозрачный квадрат, естественно ничего видно не будет

steel97 , оф бляха муха забыл цвет вставить

steel97 , не фига ((( попробовал svg добавить тоже самое , цвет я сменил на белый

css

   .buttons a::before { color:#fff; ;content: ' <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#fff" class="bi bi-plus-lg" viewBox="0 0 16 16">   <path fill-rule="evenodd" d="M8 2a.5.5 0 0 1 .5.5v5h5a.5.5 0 0 1 0 1h-5v5a.5.5 0 0 1-1 0v-5h-5a.5.5 0 0 1 0-1h5v-5A.5.5 0 0 1 8 2Z"/> </svg>'; }

pyrokinesis , работает. тоже надо в base64 кодировать

css

   .buttons a::before { content: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iI2ZmZiIgY2xhc3M9ImJpIGJpLXBsdXMtbGciIHZpZXdCb3g9IjAgMCAxNiAxNiI+DQoJICAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOCAyYS41LjUgMCAwIDEgLjUuNXY1aDVhLjUuNSAwIDAgMSAwIDFoLTV2NWEuNS41IDAgMCAxLTEgMHYtNWgtNWEuNS41IDAgMCAxIDAtMWg1di01QS41LjUgMCAwIDEgOCAyWiIvPg0KPC9zdmc+'); }

Изображение

------

84144_imgsvg.png (917 b)
Скачиваний: 156

steel97 , получилось, спс спс получилось, только вот как в нем размер сделать?

steel97 , я кодировку тогда уже делал , тоже не работало ((

pyrokinesis ,

css

   .buttons a::before { content: ""; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iI2ZmZiIgY2xhc3M9ImJpIGJpLXBsdXMtbGciIHZpZXdCb3g9IjAgMCAxNiAxNiI+DQoJICAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOCAyYS41LjUgMCAwIDEgLjUuNXY1aDVhLjUuNSAwIDAgMSAwIDFoLTV2NWEuNS41IDAgMCAxLTEgMHYtNWgtNWEuNS41IDAgMCAxIDAtMWg1di01QS41LjUgMCAwIDEgOCAyWiIvPg0KPC9zdmc+'); background-size: contain; background-repeat: no-repeat; display: inline-block; width: 40px; height: 40px; }

можно размерность задавать так, не могу с уверенностью сказать что это правильный подход, но вроде работает.

pyrokinesis , к слову svg можно и без base64 использовать

css

   url("data:image/svg+xml; utf8, <svg>...</svg>");

но лично я предпочитаю base64

steel97 , да спс работает, можно было бы конечно просто скачать svg и локально использовать,

просто разбераюсь пока с добавлением svg.

если использовать локально <img src='123.svg'> то просто цвет и размер просто базово задается