Question

如何从平铺结构中创建单个图像，如下所示：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2>Problem</h2>
<label for="one">#ONE</label>
<input type="text" class="example" data-group="group1" id="one">
<br/>
<label for="two">#TWO</label>
<input type="text" class="example" data-group="group1" readonly="readonly" id="two">

        <h2>Problem</h2>
<label for="three">#THREE</label>
<input type="text" class="example" data-group="group2" id="three">
<br/>
<label for="four">#FOUR</label>
<input type="text" class="example" data-group="group2" readonly="readonly" id="four">

        <h2>Problem</h2>
<label for="five">#FIVE</label>
<input type="text" class="example" data-group="group3" id="five">
<br/>
<label for="six">#SIX</label>
<input type="text" class="example" data-group="group3" readonly="readonly" id="six">

这是详细信息：

+-----+-----+-----+
|tile1|tile2|tile3|
+-----+-----+-----+

<div>        
  <div>    
    <img> tile 1
  </div>  
</div>
<div>        
  <div>    
    <img> tile 2
  </div>  
</div>
<div>        
  <div>    
    <img>  tile 3
  </div>  
</div>

Answer 1

您可以简单地制作足够大的画布来容纳所有图像，然后以适当的偏移量绘制每个图像，以复制HTML提供的相同平铺效果。

或者，如果您真的想要专门从HTML中捕获布局，那么有一个名为html2canvas（https://html2canvas.hertzen.com/）的软件包可以从任何HTML进行屏幕截图，而不仅仅是平铺图像。

从平铺img创建一个img

1 个答案: