Html 绝对图像顶部的链接变得不可点击

我尝试更改图像和超链接的z索引，但没有成功。如果我删除了图片（girl.png），链接就会正常工作。我做错了什么

     <table width="842" cellpadding="0" cellspacing="0" bgcolor="#f9a531" style="margin-bottom:0px; margin-top:50px; padding-right:20px;">
  <tr><td height="30" align="right" valign="middle"><a href="portfolio.html">PORTFOLIO</a>&nbsp;&nbsp;<a href="https://www.facebook.com/pages/Ashleys-Hair-Design/299450416776890https://www.facebook.com/pages/Ashleys-Hair-Design/299450416776890" target="_blank"><img src="http://ashleyshairdesign.ca/images/facebook.gif" height="18" width="8" border="0" alt="Ashley Hair Design facebook page"></a>
  <br />
  </td></tr>
  </table>
<!-- End top bar -->



    <table  width="842"  cellpadding="0" cellspacing="0" bgcolor="#e6e4e1" style="background-image:url(http://ashleyshairdesign.ca/images/bg1.gif); background-position:top; background-repeat:repeat-y; padding-top:30px;padding-left:50px; padding-right:30px;">

      <tr><td>
    <img src="http://ashleyshairdesign.ca/images/ashley.jpg" width="375" height="500" alt="Ashley Wright Hair Designer" align="middle">
        </td>      


      <td valign="top" align="left">
    <img src="http://ashleyshairdesign.ca/images/logo.png" width="290" height="131" border="0" alt="Ashley Hair Salon in Manotick"  vspace="0" />  
      <br /><br />
      <h3>
         613-715-HAIR (4247)<br />
         <a href="mailto:ashleywright63@mac.com" class="content-links">ashleywright63@mac.com</a><br />
         5562-B Manotick Main st. <br />
         Manotick, ON K4M 1B3<br />
      </h3>


      <img src="http://ashleyshairdesign.ca/images/hours.png" /><br />
      Tue 9:00 - 6:00<br />
      Wed - Thu 9:00 - 8:00<br />           
      Fri 9:00 - 6:00<br />
      Sat 9:00 - 4:00<br />
      Sun &amp; Mon - Closed<br /><br />
    <img src="http://ashleyshairdesign.ca/images/girl.png" alt="Ashleys Hair Salon" style="position:absolute; top:34%; left:53%;" class="transparent" />   
    <a href="http://www.schedulicity.com/Scheduling/Default.aspx?business=AHDZC3" title="Online scheduling" target="_blank"><img src="http://www.schedulicity.com/Business/Images/ScheduleNow_LG.png" alt="Schedule online now" border="0"  /></a> 
      </td></tr>
      <tr><td colspan="2" align="center">
        <br /><br />
      <h3 style="margin:0px;">Beauty and Personal care</h3>
      Experience in special occasion updos, contemporary styling and technical ability<br /><br /> 
    </td></tr>
      </table>

613-715-头发（4247）



5562-B曼诺蒂克大街

Manoick，位于K4M 1B3上



星期二9:00-6:00

星期三至星期四9:00至8:00

星期五9:00-6:00

周六9:00-4:00

太阳及；周一-已关闭





美容与个人护理
在特殊场合的升级、现代风格和技术能力方面的经验

网站：

格式错误的HTML:

<div style="z-index:2;>"

---

您应该删除保存链接的div！没有必要在div中删除链接

<div style="z-index:2;">link</div>
<a href="http://www.schedulicity.com/Scheduling/Default.aspx?business=AHDZC3" title="Online scheduling" target="_blank" style="z-index:3;position:absolute;">

链接

注：z索引仅适用于定位元素（位置：绝对、位置：相对或位置：固定）

编辑：

更新了JSFIDLE！正如我所注意到的，z索引仅在定位元素上起作用！您没有定位
，因此z索引对
元素不起作用，这就是图像位于链接顶部的原因

如果您查看HTML，请尝试将样式放在CSS文件中，避免内联样式。也不要将表格用于布局。表格必须用于显示数据，就像在Excel文件中一样。改用div并定位它们
 因此，我将您的代码精简为：

<table width="842" cellpadding="0" cellspacing="0" bgcolor="#e6e4e1" >
    <tr>
        <td valign="top" align="left">
            <div style="z-index:2;>"
                <a href="http://www.schedulicity.com/Scheduling/Default.aspx?business=AHDZC3" title="Online scheduling" target="_blank">
                <img src="http://www.schedulicity.com/Business/Images/ScheduleNow_LG.png" alt="Schedule online now" border="0" />
                </a>
            </div>
        </td>
    </tr>
</table>


也许你可以把你的密码贴在上面。这对某人来说更容易编辑！关于你的问题，也许可以删除图像的z索引！您应该删除保存链接的div！没有必要在div中删除链接！查看您在JSFIDLE上的工作代码：我修复了格式错误的html，但这不是解决方案我删除了div，但没有使链接可点击检查JSFIDLE上的代码！在那里对我来说很好！我们讨论的是时间表链接，不是吗？我已经添加了图像的路径，因为问题发生在您可以看到图像时。是的，日程安排链接不起作用。但是你看过我在JSFIDLE上发布的代码了吗？对我来说很好！是的。它工作的原因是没有加载图像（girl.png）。当我输入图像的完整路径时，图像已加载，但无法工作。
<div style="z-index:2;">