html2canvas 官网 ：http://html2canvas.hertzen.com/
开源地址：https://github.com/niklasvh/html2canvas
<body>
<div id="div">
<span>内容</span>
<div style="height:300px; border:solid 1px red; width:100px">内容</div>
</div>
</body>
<script src="html2canvas.min.js"></script>
<script>
var id="div"; //元素的Id
html2canvas(document.querySelector("#"+id),{
scale: 2, //缩小2倍
width: $("#"+id).width()+20, //加20的原因是为了图像位置画布的中央
height: $("#"+id).height()+20, //加20的原因是为了图像位置画布的中央
backgroundColor: "#99ccff", //设置背景色
x:-10, //设置x轴上开始位置
y:-8 //设置y轴上开始位置
}).then(canvas => {
document.body.appendChild(canvas); //展示截图
console.log("已生成图片");
// var base64 = canvas.toDataURL(); // 将canvas转换成base64
});
</script>
参考地址：https://blog.csdn.net/sodakii/article/details/127100737
标签：截图,20,base64,canvas,html2canvas,HTML,id From： https://www.cnblogs.com/xiaonanmu/p/17273534.html