How to Overlay Text on Image Using HTML with no CSS? - html

Question

I wanted to have a full-width call-to-action banner on my client's website. The template that my client has does not support CSS, so I'm making use of like old school HTML to build pages.
I have a background image for the img src and I want to overlay the text in it. I'm in need of a code that is working since I'm really not well-versed.
I searched up for solutions in adding overlay text to a background image, but most of the answers contain CSS. Here's a code that I tried.
<table>
<tr>
<td></td>
<td rowspan=4><img src="/uploads/image12345jpg"></td>
</tr>
<tr>
<center><td colspan=4>This is the overlay text</td></center>
</tr>
</table>
</center>
I'd appreciate your help and answers.
The support says that I have to individually add it in the HTML code... not sure where it goes.

Answer 1

I think you might be looking for something like this: https://jsfiddle.net/DIRTY_SMITH/vz04m3ph/2/
<TABLE border="0" cellpadding="0" cellspacing="0">
<TR>
<TD width="221" height="300" background="https://placeimg.com/640/480/any" valign="bottom">
<FONT size="+1" COLOR="red">This is the overlay text</FONT>
</TD>
</TR>
</TABLE>
EDIT:
This question is asking how to use inline styles, I think:
(I've also put some inline javascript on a click function because you mentioned your scripts wernt working either)
https://jsfiddle.net/DIRTY_SMITH/vz04m3ph/28/
<td style="position:relative;">
<img src="https://placeimg.com/640/480/any" style="position:absolute;z-index:1;" width="600px" height="150px" />
<div style="z-index:2;position:relative;color:red;font-weight:bold; font-size: 40px; top: 40px; left: 100px;" onClick="(function(){
alert('See You can click me');
return false;
});">
<a href="#" onClick="(function(){ alert('See You can click me'); return false; })();return false;">
your text goes here click here</a>
</div>
</td>

Answer 2

This worked for me. Thank you for the help! Appreciate it.
<div class="container" style="position:relative;text-align:center;color:white;" >
<img class="img-responsive" src="https://placeimg.com/640/480/any" alt="#" style="width:1880px;height:250px;" >
<div class="centered" style="position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);" >Example Text</div>
</div>