[Html]如何將Svg圖檔放到信件中(Outlook)

由於該次使用者希望將圖片插入至信件中，但是沒有圖床，所以想到使用svg放入圖片，將過程中遇到的問題記錄下來:

1. 圖片轉svg會失真:
   由於線上免費jpg to svg轉檔的網站，通常都會失真，後來發現 Photopea 這個網站可以將jpg export為svg，且不會失真。

2. svg放到outlook email中不會顯示圖片:
   似乎outlook不支援顯示svg，最後發現向量檔有幾種方式可以插入圖片，整理如下。
   而我使用的方式是 [2.1 img + src]
   2.1 img + src
   <img src="data:image/png;base64,iVBORw0KGgoAAA ANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4 //8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU 5ErkJggg==" alt="Red dot" />
   2.2 css
   ul.checklist li.complete { padding-left: 20px; background: white url('data:image/png;base64,iVB\ ORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEU\ AAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8\ yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAEl\ FTkSuQmCC') no-repeat scroll left top; }
   2.３ 最後就是原始的 svg
   ＜svg＞ <image width="64" height="24" href="data:image/jpeg;base64, /9j/4AAQSkZJRgABAQEAYABgAAD/2wBDADIiJSwlHzIsKSw4NTI7S31RS0VFS5ltc1p9tZ++u7Kf r6zI4f/zyNT/16yv+v/9////////wfD/////////////2wBDATU4OEtCS5NRUZP/zq/O//////// ////////////////////////////////////////////////////////////wAARCAAYAEADAREA AhEBAxEB/8QAGQAAAgMBAAAAAAAAAAAAAAAAAQMAAgQF/8QAJRABAAIBBAEEAgMAAAAAAAAAAQIR AAMSITEEEyJBgTORUWFx/8QAFAEBAAAAAAAAAAAAAAAAAAAAAP/EABQRAQAAAAAAAAAAAAAAAAAA AAD/2gAMAwEAAhEDEQA/AOgM52xQDrjvAV5Xv0vfKUALlTQfeBm0HThMNHXkL0Lw/swN5qgA8yT4 MCS1OEOJV8mBz9Z05yfW8iSx7p4j+jA1aD6Wj7ZMzstsfvAas4UyRHvjrAkC9KhpLMClQntlqFc2 X1gUj4viwVObKrddH9YDoHvuujAEuNV+bLwFS8XxdSr+Cq3Vf+4F5RgQl6ZR2p1eAzU/HX80YBYy JLCuexwJCO2O1bwCRidAfWBSctswbI12GAJT3yiwFR7+MBjGK2g/WAJR3FdF84E2rK5VR0YH/9k="/> ＜/svg＞

後記:
最後總算是將圖片成功沒有失真，並且可以顯示在outlook信件中，補充一個好用的圖片縮放不失真的小方法。可以把jpg丟到ppt中，此時ppt的縮放是不會失真的，最後右鍵另存新檔，就可以存好了。

參考：
１．　https://en.wikipedia.org/wiki/Data_URI_scheme