1

我有一个使用背景图像（css sprite）的徽标链接。一切正常，但是当我尝试在链接顶部添加 20px 填充（为用户单击链接提供更多空间）时，背景图像不会向下移动。这是我的CSS：

a {
    background-image:url("sprite.png");
    background-repeat:no-repeat;
    display:block;
    height:70px;
    width:70px;
    padding-top:20px; /* give top of the link more click space */
}

还有我的html：

<a href="#" style="background-position:0 0;"></a>


我究竟做错了什么？
编辑：我认为你们错过了最初的目标。我的目标是给 logo 链接更多的点击空间。如果我使用边距，则元素链接会被向下推，这不会像我最初想要的那样提供更多的点击空间。

4

2 回答 2

0

填充不会影响背景图像。要影响链接的点击区域，请添加填充，然后将背景 y 偏移量更改相同的量，即：

a
{
    padding-top: 10px;
    background-position: 0px 10px;
}

这是一个演示行为的小提琴

于 2012-06-16T03:09:46.060 回答
0

尝试使用 margin 属性

 margin-top:20px
于 2012-06-16T03:10:39.900 回答