画像に文字を重ねる

画像の上に「ちっちゃんでーす」のテキストを重ねてみます

こんな風になります

ちっちゃんでーす

その仕組みは、HTMLで次のように記述しているところです。

<div style="position: relative; display: inline-block;"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/s/stamproom/20200309/20200309052359.png" alt="" itemprop="image" width="210" />
<div style="position: absolute; top: 0; left: 0; max-width: 100%; max-height: 100%; padding-left: 10px; padding-top: 0px; text-align: left;">
<div><strong><span style="font-size: 22px;">ちっちゃんでーす</span></strong></div>
</div>
</div>