Question

我的锚标记没有响应（例如我的鼠标没有响应链接作为链接）#contentAboutMe ...通过研究我发现z-index可能会影响这个...但是，我用z-index评论任何东西，它似乎不是问题。有任何想法吗？我将不胜感激任何帮助。（主持人正在我的加价中工作）

#logo {
    position: absolute;
    top: 50px;
    left: 20px;
    /*z-index: 50;*/
}
#mainHeader > h1 {
    font-size: 18px;
}
#wrapperAboutMe {
    position: absolute;
    width: 525px;
    left: 400px;
    top: 40px;
    /*z-index: 2;*/
}
#placeHolder {
    position: relative;
}
#topAboutMe {
    background-image: url(../images/aboutTopBackground.png);
    width: 525px;
    height: 47px;
}
#contentAboutMe {
    width: 525px;
    background-image: url(../images/aboutMainBackground.png);
}
#contentAboutMe p {
    padding: 0 40px 0 40px;
    text-align: justify;
}
.firstCharacter {
    display: block;
    float: left;
    color: #155763;
    font-size: 330%;
    line-height: .5em;
    padding-top: 10px;
    padding-right: 2px;
}
#bottomAboutMe {
    background-image: url(../images/aboutBottomBackground.png);
    width: 525px;
    height: 71px;
}
#aboutImage {
    width: 220px;
    height: 45px;
    background-image: url(../images/graphicAbout_03.png);
    background-repeat: no-repeat;
    float: left;
    padding: 30px 0 0 0;
    position: absolute;
    top: -25px;
    left: -100px;
}
#aboutImage span {
    display: none;
}
#aboutBackground {
    position: absolute;
    background-image: url(../images/graphicAboutBackground.png);
    width: 462px;
    height: 125px;
    left: -260px;
    top: -110px;
    z-index: 1;
}

HTML：

<article id="aboutMe">
    <div id="wrapperAboutMe">
      <div id="topAboutMe"> </div>
      <!--End topAboutMe-->

      <div id="contentAboutMe">
        <p><span class="firstCharacter">M</span>y content</p>
        <a href="includes/HappeResumeSept2012.pdf" target="_blank">View My Resume</a>
      </div>
      <!--End contentAboutMe-->

      <div id="bottomAboutMe"> </div>
      <!--End bottomAboutMe-->

      <div id="placeHolder">
        <h1 id="aboutImage"><span>About Me</span></h1>
        <div id="aboutBackground"></div>
        <!--End aboutBackground--> 
      </div>
      <!--End placeHolder--> 

    </div>
    <!--End wrapperAboutMe--> 

  </article>
  <!--End Article_aboutMe-->

Answer 1

id aboutBackground的div位于链接的顶部，因此当您尝试单击时，它实际上是针对该div进行注册，而不是链接。

要解决此问题，请将#aboutBackground z-index更改为-1，因此它将如下所示：

#aboutBackground {
position: absolute;
background-image: url(../images/graphicAboutBackground.png);
width: 462px;
height: 125px;
left: -260px;
top: -110px;
z-index: -1; // this line edited
}

Answer 2

摆脱这种风格

#placeHolder {
    position: relative;
}

这会将元素置于链接之上

锚标签没有响应

2 个答案: