图片转换SVG网页HTML源码，只是把位图包装成了矢量图的格式。直接把位图的每个像素塞进去svg，这样生成的放大后会样糊。
完整代码：
code<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>SVG图片生成器</title> <style> body { display: flex; justify-content: center; align-items: center; height: 100vh; background-color: #f7f7f7; font-family: Arial, sans-serif; } .container { text-align: center; padding: 20px; background-color: #fff; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } h1 { margin-top: 0; } input[type="file"] { margin-bottom: 10px; display: none; } label { display: inline-block; padding: 10px 20px; background-color: #007bff; color: #fff; cursor: pointer; } .avatar { margin-top: 10px; max-width: 100%; height: auto; } .download-button { margin-top: 10px; display: none; } </style></head><body> <div class="container"> <h1>SVG图片生成器</h1> <label for="upload">选择图片</label> <input id="upload" type="file" required accept="image/gif, image/jpeg, image/png"> <img class="avatar" src="" alt="Avatar Preview"> <a class="download-button" href="#" download="noavatar.svg">下载 SVG</a> </div><script>document.getElementById('upload').addEventListener('change', function() { var file = this.files[0]; if (file) { var reader = new FileReader(); reader.readAsDataURL(file); reader.addEventListener('load', function() { var dataURL = this.result; var svgCode = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="120" height="120"><image xlink:href="'+dataURL+'" height="120" width="120"/></svg>'; var blob = new Blob([svgCode], {type: 'image/svg+xml'}); var url = URL.createObjectURL(blob); document.querySelector('.avatar').src = url; document.querySelector('.download-button').style.display = 'inline-block'; document.querySelector('.download-button').href = url; }); }});</script></body></html>
