Text over image with tables
Here is an example of an image of text over it:| GASPS! Contumacious is finally online! |
The code for the example shown above is:
<TABLE BORDER="0" cellpadding="0" CELLSPACING="0">
<TR>
<TD WIDTH="162" HEIGHT="201" BACKGROUND="html/textoverimage.jpg" VALIGN="bottom">
<FONT SIZE="+1" COLOR="blue">GASPS! Contumacious is finally online!</FONT></TD>
</TR>
</TABLE>
-
<TABLE BORDER="0" cellpadding="0" CELLSPACING="0"> shows that we are using tables to make the text over the image with no cellpadding or border.-
<TR> shows that it is a new row in the table, though it is not needed.-
<TD WIDTH="162" HEIGHT="201" BACKGROUND="html/textoverimage.jpg" VALIGN="bottom"> represents the width, height, background image and the positioning (valigning) of the text. They are all important because it represents the limits of which the text will be going until. If you do not state the width, or limit the height, the text will repeat the background. Remember to put the image into a trusted server. You can change valign: bottom to valign: top if you wish to put the position of the text to the top instead of the bottom.-
<FONT SIZE="+1" COLOR="blue">GASPS! Contumacious is finally online!</FONT>&alt;/TD> You notice within the font tags, the text is shown. Everything else is pretty much given.-
</TR></TABLE> represents the end of the row and the end of the table.The table method is the best for making text over an image. Otherwise, using dividers or layers will change depending on the internet browser.
That's pretty much it; the tutorial is ended.
Home | Site Information | Policy and FAQ | Linkage
Site and layout is © to Heidi Hu. All tutorials, information and items are copyrighted to their rightful owners. All rights reserved.