如何从一个</p> <hr> <p>一个html元素保存为png

Question

不是因为我需要转换为HTML画布重复，不是我开发，它将在屏幕上的某些内容的站点。

我需要能够捕捉<div>的内容设置在PNG

我已经尝试了一些镀铬的扩展，但没有工作不幸

  <style type="text/css"> 
      * { 
       margin: 0px 0px; 
       padding: 0px 0px; 
      } 
      #box { 
       background: #FFFF00; 
       width: 100px; 
       height: 50px; 
      } 
      </style> 
      <div id="box"> 
      This is my box :) 
      </box> 

Answer 1

html2canvas可以帮助你。

从官方网站：

该脚本可以让你把网页或它的 部分的“截图”，直接在用户的浏览器。该屏幕截图基于DOM ，因此它可能不是100％准确的真实表示，因为其 没有制作实际屏幕截图，而是根据页面上提供的信息构建屏幕截图。

html2canvas(document.getElementById('box'), { 
    onrendered: function(canvas) { 
    document.body.appendChild(canvas); 
    }, 
    width: 400, 
    height: 400 
}); 

点击here看到一些活生生的实例。