Jump to content

I made a Template In Photoshop and i sliced it but How Can i Write Ontop of Imag


Recommended Posts

Alright i got a Template made in Photoshop CS 2 it has a HTML page and a image files now the templace is located here: http://xizionz.vectoredhost.com/Untitled-1.html

alright now as you can see it has images how can i write text ontop of the images VIA the .HTML file?

file:
[code]<html>
<head>
<title>Untitled-1</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- ImageReady Slices (Untitled-1) -->
<center>
<table id="Table_01" width="701" height="801" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="14">
<img src="images/Untitled-1_01.gif" width="700" height="16" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
<td rowspan="11">
<img src="images/Untitled-1_02.gif" width="26" height="784" alt=""></td>
<td colspan="11">
<img src="images/Untitled-1_03.gif" width="650" height="81" alt=""></td>
<td colspan="2">
<img src="images/Untitled-1_04.gif" width="24" height="81" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="81" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="2">
<a href="http://xizionz.vectoredhost.com">
<img src="images/Untitled-1_05.gif" width="128" height="72" border="0" alt=""></a></td>
<td colspan="7">
<img src="images/Untitled-1_06.gif" width="430" height="9" alt=""></td>
<td colspan="3" rowspan="3">
<a href="http://xizionz.vectoredhost.com/blogz">
<img src="images/Untitled-1_07.gif" width="108" height="94" border="0" alt=""></a></td>
<td rowspan="10">
<img src="images/Untitled-1_08.gif" width="8" height="703" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="9" alt=""></td>
</tr>
<tr>
<td colspan="3" rowspan="3">
<img src="images/Untitled-1_09.gif" width="155" height="125" alt=""></td>
<td rowspan="3">
<a href="http://xizionz.vectoredhost.com/board">
<img src="images/Untitled-1_10.gif" width="117" height="125" border="0" alt=""></a></td>
<td colspan="3" rowspan="3">
<img src="images/Untitled-1_11.gif" width="158" height="125" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="63" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="2">
<img src="images/Untitled-1_12.gif" width="128" height="62" alt="" value="Yo"></td>
<td>
<img src="images/spacer.gif" width="1" height="22" alt=""></td>
</tr>
<tr>
<td colspan="3">
<img src="images/Untitled-1_13.gif" width="108" height="40" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="40" alt=""></td>
</tr>
<tr>
<td rowspan="6">
<img src="images/Untitled-1_14.gif" width="23" height="569" alt=""></td>
<td colspan="2" rowspan="5">
<img src="images/Untitled-1_15.gif" width="119" height="530" alt=""></td>
<td colspan="5">
<img src="images/Untitled-1_16.gif" width="366" height="13" alt=""></td>
<td colspan="2" rowspan="5">
<img src="images/Untitled-1_17.gif" width="133" height="530" alt=""></td>
<td colspan="2" rowspan="6">
<img src="images/Untitled-1_18.gif" width="25" height="569" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="13" alt=""></td>
</tr>
<tr>
<td colspan="5">
<img src="images/Untitled-1_19.gif" width="366" height="64" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="64" alt=""></td>
</tr>
<tr>
<td colspan="5">
<img src="images/Untitled-1_20.gif" width="366" height="59" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="59" alt=""></td>
</tr>
<tr>
<td rowspan="3">
<img src="images/Untitled-1_21.gif" width="34" height="433" alt=""></td>
<td colspan="3">
<img src="images/Untitled-1_22.gif" width="296" height="342" alt=""></td>
<td rowspan="3">
<img src="images/Untitled-1_23.gif" width="36" height="433" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="342" alt=""></td>
</tr>
<tr>
<td colspan="3" rowspan="2">
<img src="images/Untitled-1_24.gif" width="296" height="91" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="52" alt=""></td>
</tr>
<tr>
<td colspan="2">
<img src="images/Untitled-1_25.gif" width="119" height="39" alt=""></td>
<td colspan="2">
<img src="images/Untitled-1_26.gif" width="133" height="39" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="39" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="26" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="23" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="105" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="14" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="34" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="107" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="117" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="72" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="36" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="50" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="83" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="9" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="16" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="8" height="1" alt=""></td>
<td></td>
</tr>
</table>
</center>
<!-- End ImageReady Slices -->
</body>
</html>[/code]
Use CSS to put most of the images as background images. You should now be able to put text on top of the image.

ALso I would recommend you to not use the generated code made by Photoshop/Imageready, however I would recommend you to code the page layout from scratch. As from looking at the HTML there is a lot of uneeded code.
if you slice it in photoshop, you gotta set the image as background. This is just an example

Change this
[code]
<td colspan="5">
<img src="images/Untitled-1_20.gif" width="366" height="59" alt=""></td>
[/code]
to
[code]
<td colspan="5" background="images/Untitled-1_20.gif" width="366" height="59">
Your text goes here
</td>
[/code]
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.