Как совместить все элементы из div'а в изображение?

Question

[pashulke]

Допустим, есть несколько блоков div друг в друге, в которых может располагаться картинка, текст, какие-либо CSS-эффекты и т.д.:

<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>

Как совместить их в одну единую картинку? Что-то читал про canvas, но так и не нашёл чего-то понятного.
По сути, нужно сделать скрин этого места экрана. Желательно JS, но интересны и варианты с PHP.

Answer 1

[Moskus]

html2canvas.hertzen.com