我需要在CSS数据URI中编码哪些字符？

Chrome似乎支持将SVG直接插入CSS URL，以避免对其进行base64编码，并将其大小放大33%，这有点酷/方便。然而，IE对这样的事情感到窒息，希望数据URI是URL编码的（例如，

，每个字符都应该是URL编码的（
！\“\$%&'（），：；？[\]^`{{124;}
），而最低公分母（IE）似乎只要求转义
“\%[]^`{124;}
（当数据URI用引号括起来时）

Windows7，IE 9

与base64编码相比，许多最小化的SVG文件最终变得更小，并且跨浏览器的兼容性是相同的


无编码（URI:289b）


URL编码默认值（URI:397b）


仅编码的URL
“#%[]^`{124;}
（URI:319b）



url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21.9 31"><path fill="#000" d="M10.9 0C4.9 0 0 5.5 0 10.9 0 20.1 10.9 31 10.9 31s10.9-10.9 10.9-20.1C21.9 5.5 17 0 10.9 0zM6.1 10.9c0-2.7 2.2-4.8 4.8-4.8s4.8 2.2 4.8 4.8c0 2.7-2.2 4.8-4.8 4.8s-4.8-2.1-4.8-4.8z"/></svg>')

url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMS45IDMxIj48cGF0aCBmaWxsPSIjMDAwIiBkPSJNMTAuOSAwQzQuOSAwIDAgNS41IDAgMTAuOSAwIDIwLjEgMTAuOSAzMSAxMC45IDMxczEwLjktMTAuOSAxMC45LTIwLjFDMjEuOSA1LjUgMTcgMCAxMC45IDB6TTYuMSAxMC45YzAtMi43IDIuMi00LjggNC44LTQuOHM0LjggMi4yIDQuOCA0LjhjMCAyLjctMi4yIDQuOC00LjggNC44cy00LjgtMi4xLTQuOC00Ljh6Ii8+PC9zdmc+');

url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2021.9%2031%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M10.9%200C4.9%200%200%205.5%200%2010.9%200%2020.1%2010.9%2031%2010.9%2031s10.9-10.9%2010.9-20.1C21.9%205.5%2017%200%2010.9%200zM6.1%2010.9c0-2.7%202.2-4.8%204.8-4.8s4.8%202.2%204.8%204.8c0%202.7-2.2%204.8-4.8%204.8s-4.8-2.1-4.8-4.8z%22/%3E%3C/svg%3E');

url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 21.9 31%22%3E%3Cpath fill=%22%23000%22 d=%22M10.9 0C4.9 0 0 5.5 0 10.9 0 20.1 10.9 31 10.9 31s10.9-10.9 10.9-20.1C21.9 5.5 17 0 10.9 0zM6.1 10.9c0-2.7 2.2-4.8 4.8-4.8s4.8 2.2 4.8 4.8c0 2.7-2.2 4.8-4.8 4.8s-4.8-2.1-4.8-4.8z%22/%3E%3C/svg%3E');