How to combine all elements from a div into an image?

Question

Canvas

Let's say there are several div blocks in each other, which can contain an image, text, any CSS effects, etc.:

<div class="q">
     <div class="e"><img src="img/img.png"></div>
     <div class="w">Бла-бла-бла</div>
     <div class="e"><img src="img/image.png"></div>
     <div class="r"></div>
</div>

How to combine them into one single picture? I read something about canvas, but did not find something understandable.
In fact, you need to make a screen of this place on the screen. Preferably JS, but options with PHP are also interesting.

Answer 1

html2canvas.hertzen.com