Question

在这里给出了一些svg代码：

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 16 16">
<path d="M15.025,15.2017972 L10.8665842,11.0433814 C12.9070491,8.61548644 12.8037344,4.99947266 10.5308115,2.72654972 C8.12874516,0.324483427 4.22861601,0.324483427 1.82654972,2.72654972 C-0.575516573,5.12861601 -0.575516573,9.02874516 1.82654972,11.4308115 C3.01466853,12.6189303 4.61604606,13.2388183 6.19159492,13.2388183 C7.61217176,13.2388183 9.00691993,12.7480736 10.1692101,11.7924128 L14.3276259,15.9508287 L15.025,15.2017972 Z M2.54975248,10.7076087 C0.560944899,8.71880112 0.560944899,5.46438872 2.54975248,3.47558115 C3.5570706,2.46826302 4.84850409,1.9775183 6.16576625,1.9775183 C7.48302841,1.9775183 8.80029057,2.46826302 9.78178003,3.47558115 C11.7705876,5.46438872 11.7705876,8.71880112 9.78178003,10.7076087 C7.79297245,12.6964163 4.53856005,12.6964163 2.54975248,10.7076087 Z"/>
</svg>

如何在base 64中对此进行编码并在我的html文档中使用它？

Answer 1

如果您还没有，请通过将svg代码复制到保存为myFile.svg的文件中来创建.svg文件。确保3个第一行（xml，DOCTYPE和svg都带有它们的属性，否则会破坏 - 视图框的大小可以修改）
将文件拖放到http://jpillora.com/base64-encoder/
复制以data：image / svg + xml; base64开头的代码，并在html代码中粘贴img标签的src属性：

<img id="myId" width="16px" height="16px" alt="search button" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiPg0KPHBhdGggZD0iTTE1LjAyNSwxNS4yMDE3OTcyIEwxMC44NjY1ODQyLDExLjA0MzM4MTQgQzEyLjkwNzA0OTEsOC42MTU0ODY0NCAxMi44MDM3MzQ0LDQuOTk5NDcyNjYgMTAuNTMwODExNSwyLjcyNjU0OTcyIEM4LjEyODc0NTE2LDAuMzI0NDgzNDI3IDQuMjI4NjE2MDEsMC4zMjQ0ODM0MjcgMS44MjY1NDk3MiwyLjcyNjU0OTcyIEMtMC41NzU1MTY1NzMsNS4xMjg2MTYwMSAtMC41NzU1MTY1NzMsOS4wMjg3NDUxNiAxLjgyNjU0OTcyLDExLjQzMDgxMTUgQzMuMDE0NjY4NTMsMTIuNjE4OTMwMyA0LjYxNjA0NjA2LDEzLjIzODgxODMgNi4xOTE1OTQ5MiwxMy4yMzg4MTgzIEM3LjYxMjE3MTc2LDEzLjIzODgxODMgOS4wMDY5MTk5MywxMi43NDgwNzM2IDEwLjE2OTIxMDEsMTEuNzkyNDEyOCBMMTQuMzI3NjI1OSwxNS45NTA4Mjg3IEwxNS4wMjUsMTUuMjAxNzk3MiBaIE0yLjU0OTc1MjQ4LDEwLjcwNzYwODcgQzAuNTYwOTQ0ODk5LDguNzE4ODAxMTIgMC41NjA5NDQ4OTksNS40NjQzODg3MiAyLjU0OTc1MjQ4LDMuNDc1NTgxMTUgQzMuNTU3MDcwNiwyLjQ2ODI2MzAyIDQuODQ4NTA0MDksMS45Nzc1MTgzIDYuMTY1NzY2MjUsMS45Nzc1MTgzIEM3LjQ4MzAyODQxLDEuOTc3NTE4MyA4LjgwMDI5MDU3LDIuNDY4MjYzMDIgOS43ODE3ODAwMywzLjQ3NTU4MTE1IEMxMS43NzA1ODc2LDUuNDY0Mzg4NzIgMTEuNzcwNTg3Niw4LjcxODgwMTEyIDkuNzgxNzgwMDMsMTAuNzA3NjA4NyBDNy43OTI5NzI0NSwxMi42OTY0MTYzIDQuNTM4NTYwMDUsMTIuNjk2NDE2MyAyLjU0OTc1MjQ4LDEwLjcwNzYwODcgWiIvPg0KPC9zdmc+DQo=" />

将svg转换为svg base64并将其嵌入HTML文档

1 个答案: