0

http://justxp.plutohost.net/gxx/

尝试悬停按钮。

悬停/链接仅在您将鼠标悬停在按钮顶部时才有效。为什么会这样？

这是代码：

    <a href="#">
        <div class="button-1">
            <span class="bebas">play</span>
        </div>
    </a>
    <a href="#">
        <div class="button-1">
            <span class="bebas">community</span>
        </div>
    </a>
    <a href="#">
        <div class="button-1">
            <span class="bebas">account help</span>
        </div>
    </a>

css

   .button-1 {
   background-image: url("../img/buttonoff.png");
   background-repeat: no-repeat;
width: 302px;
height: 82px;
margin-left: 1.4%;
margin-top: 1%;
float: left;
text-align: center;
line-height: 90px;
-webkit-transition: all 200ms ease-in-out;
        -moz-transition: all 200ms ease-in-out;
        -ms-transition: all 200ms ease-in-out;
        -o-transition: all 200ms ease-in-out;
        transition: all 200ms ease-in-out;
}
.button-1:hover {
background-image: url("../img/buttonon.png");
background-repeat: no-repeat;
width: 302px;
height: 82px;
-webkit-transition: all 200ms ease-in-out;
        -moz-transition: all 200ms ease-in-out;
        -ms-transition: all 200ms ease-in-out;
        -o-transition: all 200ms ease-in-out;
        transition: all 200ms ease-in-out;
}

我看有什么不对吗？我试着把高度调大，还是不行。

我对此非常好奇！

4

2 回答 2

1

您需要在班级新闻上添加边距：

.news {
    position: relative;
    top: 5%;
    margin-top: 65px;
}

编辑：

奖金！请在按钮的背景上使用 css3 背景渐变而不是图像。

gradients.glrzad.com

希望这会有所帮助，如果我错过了干扰，对不起。

于 2013-01-28T16:58:22.590 回答
0

你的这个 div 覆盖了按钮

<div class="news">

你可以做的是：

要么你添加这个：

<br clear="all"/> //<---add this just above the div class named "news"

或者你可以为 div 调整你的css class news：

.news {
   position: relative;
   top: 24%;
 }
于 2013-01-28T17:03:05.457 回答