我有一个base64 svg字符串,无法在FF或Safari中使用,但在Chrome中效果很好。 (最新版本)我在FF中收到的错误是:
我的css看起来像:
.icon.icon-play {
background-image: url("data:image/svg+xml;\a base64, PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIxMDEiIGhlaWdodD0iMTI4IiB2aWV3Qm94PSIwIDAgMTAxIDEyOCI+CjxwYXRoIGZpbGw9IiNmZmZmZmYiIGQ9Ik05OC44NTcgNjYuMjE0bC05NC44NTcgNTIuNzE0cS0xLjY0MyAwLjkyOS0yLjgyMSAwLjIxNHQtMS4xNzktMi41NzF2LTEwNS4xNDNxMC0xLjg1NyAxLjE3OS0yLjU3MXQyLjgyMSAwLjIxNGw5NC44NTcgNTIuNzE0cTEuNjQzIDAuOTI5IDEuNjQzIDIuMjE0dC0xLjY0MyAyLjIxNHoiPjwvcGF0aD4KPC9zdmc+Cg==");
}
我不知道从哪里开始,除了重新定位图像。这是我目前无法做到的。
答案 0 :(得分:0)
在Firefox上工作正常(即使我留下无关的\ a)。虽然没有...但是没有...
.icon {
background-color: black;
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIxMDEiIGhlaWdodD0iMTI4IiB2aWV3Qm94PSIwIDAgMTAxIDEyOCI+CjxwYXRoIGZpbGw9IiNmZmZmZmYiIGQ9Ik05OC44NTcgNjYuMjE0bC05NC44NTcgNTIuNzE0cS0xLjY0MyAwLjkyOS0yLjgyMSAwLjIxNHQtMS4xNzktMi41NzF2LTEwNS4xNDNxMC0xLjg1NyAxLjE3OS0yLjU3MXQyLjgyMSAwLjIxNGw5NC44NTcgNTIuNzE0cTEuNjQzIDAuOTI5IDEuNjQzIDIuMjE0dC0xLjY0MyAyLjIxNHoiPjwvcGF0aD4KPC9zdmc+Cg==");
width: 101px;
height: 128px;
}
You seem to have some extraneous %20 characters and a \a character. %20
<div class="icon"></div>