画像上にテキスト配置

画像の上にテキストを配置できます。

 
<div class="col-wrap col3-wrap col-onimage">
<!--ココカラ　以下のコードを３つ記述で3列画像-->
<div class="col m20-b border">
<a href="#">
<img src="/wp-content/uploads/2018/03/image0331.png" alt="サンプル画像" />
</a>
<p class="text-onimage"><a href="#">テキスト</a></p>
</div>
<!--ココマデ-->
</div>

背景画像の上にテキストを配置できます。

<div class="col-wrap col3-wrap col-onimage02">
<div class="col m20-b border" style="background-image: url(/wp-content/uploads/2018/03/image0331.png);">
<a href="#">
<p class="text-onimage">テキストが入りますテキストが入りますテキストが入りますテキストが入ります</p>
</a>
</div>
<div class="col m20-b border" style="background-image: url(/wp-content/uploads/2018/03/image0331.png);">
<a href="#">
<p class="text-onimage">テキストが入りますテキストが入りますテキストが入りますテキストが入ります</p>
</a>
</div>
<div class="col m20-b border" style="background-image: url(/wp-content/uploads/2018/03/image0331.png);">
<a href="#">
<p class="text-onimage">テキストが入りますテキストが入りますテキストが入りますテキストが入ります</p>
</a>
</div>
</div>