Question

我的<li>由于某种原因不会变成链接，这是我的html和css

希望有人可以提供帮助。

<div class="header_quick_link">
    <ul>
     <li style="padding-left:700px;"><a href="#"><img src="images/signup-off.png" height="26px" alt="sign-up off"/></a></li>
     <li style="padding-left:798px;"><a href="#"><img src="images/login-off.png" height="26px" alt="sign-up off"/></a></li>
    </ul>
   </div>


.header_quick_link{
left: 0px;
right: 0px;
top: 0px;
height: 26px;
position: absolute;
background: url(../images/quicklink.png);
background-repeat: repeat-x;
z-index: -1;
}

.header_quick_link li {
float: none;
list-style: none;
left: 0px;
right: 0px;
top: 0px;
position: absolute;
z-index: 6;
height: 26px;
}

Answer 1

好吧，你有一个令人眼花缭乱的花车，绝对定位，列表，背景图像，前景图像，边距和填充的混合。把事情简单化。不要过度复杂化。从一些语义HTML开始：

<div id="signup">
<a href="#"><img src="images/signup-off.png" height="26" alt="sign-up off"/></a>
<a href="#"><img src="images/login-off.png" height="26" alt="sign-up off"/></a>
</div>

然后找出如何设计它的样式。我想你想要在右边彼此相邻的两个链接。轻松完成。

#signup { overflow: hidden; float: right; }
#signup a { float: left; display: block; margin: 0 10px; padding: 2px 8px; }

简单的HTML帮助

1 个答案: