以下是我正在使用的内容:http://shaneboland.com/ms2/contact.html
但这就是我想要的:http://shaneboland.com/ms2/test.jpg
我有一个包含我的表格的div:
<div id="wrapper">
<div id="content-pad">
<div id="mid-col-wide">
<form name="contactform" method="post" action="contact/send_form_email.php">
<table width="450px">
<tr>
<td valign="top">
<label for="first_name">Full Name *</label>
</td>
<td valign="top">
<input type="text" name="full_name" maxlength="50" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="email">Email Address *</label>
</td>
<td valign="top">
<input type="text" name="email" maxlength="80" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="comments">Message *</label>
</td>
<td valign="top">
<textarea name="comments" maxlength="1000" cols="25" rows="6"></textarea>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center">
<input type="submit" value="Submit">
</td>
</tr>
</table>
</form>
</div><!-- //mid-col -->
</div><!-- //content-pad -->
</div><!-- //wrapper -->
然后我有一个单独的div,其中包含一个包含多个链接的图像映射:
<div align="center">
<img name="emp" src="contact/main.jpg" usemap="#ep" alt="Mammal Swag" width="940" height="801" border="0"/>
<map name="ep">
<area shape="poly" coords="20,144,176,159,183,222,42,223,20,144" href="about.html" onMouseOver="changeabout()" onMouseOut="changemain()"/>
<area shape="poly" coords="49,228,184,228,192,289,118,315,36,265,49,228" href="index.html" onMouseOver="changecontact()" onMouseOut="changemain()"/>
<area shape="poly" coords="675,639,692,607,773,607,754,713,693,712,675,639" href="http://www.facebook.com/MammalSwag" onMouseOver="changefacebook()" onMouseOut="changemain()"/>
<area shape="poly" coords="185,159,370,149,320,243,199,285,185,159" href="index.html" onMouseOver="changehome()" onMouseOut="changemain()"/>
<area shape="poly" coords="821,536,877,626,766,694,779,606,821,536" href="http://www.twitter.com/MammalSwag" onMouseOver="changetwitter()" onMouseOut="changemain()"/>
</map>
</div>
我想这样做,以便我的联系表格div保持在那个大绿地内。因此,当窗口调整大小时,联系人表单div仍然位于绿色空间的同一位置。
如何使用我的图像映射调整我的联系表格div?