Requirement
I want to create an image with multiple hyperlinks on it and email it to someone.
What I did
I used Photoshop's slicing method and added URL to the slices. I saved the composition for web. For it to work on my recipient's end, I uploaded each slice to an online photo hosting website and edited the HTML tag img src="local photo location" to img src = "online photo location". But the problem is I get multiple white-spaces between each slice which distorts the overall image.
Code
<html>
<head>
<title>General Infosheet July 25</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (General Infosheet July 25.jpg) -->
<table id="Table_01" width="800" height="1034" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<a href="http://facebook.com/">
<img src="http://ift.tt/2abnWcU" width="539" height="158" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://ift.tt/2aclxlx" width="260" height="452" alt=""></td>
<td>
<img src="http://ift.tt/2aboejM" width="1" height="158" alt=""></td>
</tr>
<tr>
<td rowspan="4">
<img src="http://ift.tt/2acm7iX" width="539" height="876" alt=""></td>
<td>
<img src="http://ift.tt/2aboejM" width="1" height="294" alt=""></td>
</tr>
<tr>
<td>
<a href="http://twitter.com/">
<img src="http://ift.tt/2abnTh6" width="260" height="144" border="0" alt=""></a></td>
<td>
<img src="http://ift.tt/2aboejM" width="1" height="144" alt=""></td>
</tr>
<tr>
<td>
<a href="http://instagram.com/">
<img src="http://ift.tt/2acmqup" width="260" height="134" border="0" alt=""></a></td>
<td>
<img src="http://ift.tt/2aboejM" width="1" height="134" alt=""></td>
</tr>
<tr>
<td>
<a href="http://photobucket.com/">
<img src="http://ift.tt/2aboEqG" width="260" height="304" border="0" alt=""></a></td>
<td>
<img src="http://ift.tt/2aboejM" width="1" height="304" alt=""></td>
</tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>
Question
I want to remove white-space between the images. Please provide code edits that will help to remove these white-space. Thank you.
Aucun commentaire:
Enregistrer un commentaire