Question

我一直在使用div构建我的第一个CSS网站，并且遇到按钮问题。虽然我能够使按钮处理翻转，但链接不响应。请有人请指教。谢谢。

HTML：

 <div class="wrapArrow">   

 <div class="arrow" style="cursor: pointer;"><a href="../index.html" title="home"    target="_self"><span>home</span></a></div>

 </div><!-- END wrapArrow -->

CSS：

.wrapArrow {
margin: 70px 0 0 0;
padding: 0;
width: 20px;
height: 20px;
float: right;
}


.arrow {
display: block;
width: 20px;
height: 20px;
background-image: url(../images/nav/arrows.gif);
background-repeat:  no-repeat;

}


.arrow:hover { 
  background-position: 0 -20px; }


.arrow span {
 display: none; }

Answer 1

看起来你需要摆脱

.arrow span {
    display: none;
}

有什么理由需要在那里吗？如果显示设置为none，则隐藏链接工作所需的可单击元素。

Answer 2

.arrow a是0 x 0 px

点击真的很难。相信我，我试过了。

尝试：

        .arrow a {
            width: 100%;
            height: 100%;
            display: block;
        }

Answer 3

由于您的<span>未显示，因此您的链接没有内容，因此折叠为宽度和高度为0，从而使其无法点击。

为什么不让锚本身具有arrow类？

<div class="wrapArrow">   

<a href="../index.html" title="home" target="_self" class="arrow" style="cursor: pointer;"><span>home</span></a>

</div><!-- END wrapArrow -->

CSS滚动工作但链接不工作

3 个答案: