2

我为我的 css 使用精灵表,它们工作得很好,但是我想在页脚上有一部分我的精灵表,它就像一个弯曲的块,左侧的内容框会稍微超过它的顶部。

但是我似乎无法将精灵的一部分作为位于底部的背景。

现在通常你会做这样的事情

background:url(sprite.png) -20px -144px no-repeat; display:block; width:800px; height:225px;

但是当我尝试这样的事情时

background-color: #ffffff;
font-size: .75em;
font-family: Verdana, Helvetica, Sans-Serif;
margin: 0;
padding: 0;
color: #000000;
height:100%;
width:800px;
background-image:url(images/sprite.jpg); 
background-position:0 0 no-repeat bottom left;

我得到了完整的精灵表作为背景.....所以我的问题是是否可以只获取精灵的一部分并将该部分用作 div 的底部!!!!

有点拗口,但我不想仅仅放弃这个想法,如果可以做到,已经有人做到了。

4

3 回答 3

1

将它放在页脚部分内的嵌套固定大小的 div 中。如果您希望页脚 div 增长,但不希望精灵的大小超出其限制,那几乎是唯一的方法。

于 2009-11-05T18:14:51.413 回答
0

嗨谢谢,无法让它在身体上运行,所以我添加了一个容器 div:

min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -4em; background:url(images/sprite.jpg) no-repeat;     clip:rect(0,800px,270px,0); position:absolute;

但是它将 div 大小限制为正在完成的剪辑的大小,因为我的计划是始终将其放在我所有内容的底部

请原谅它在一行中,该框不会让我将所有代码添加到一个块中!!!!

于 2009-11-05T15:33:49.347 回答
-1

因此,您试图在容器内显示比您要显示的部分大的图像部分?

如果是这样,请查看剪辑属性。这是一个例子:

#myDiv {
   width:400px; height:300px;
   background:url(sprite.png);
   clip:rect(100px,250px,150px,100px);
   position:absolute;
}

http://www.julienlecomte.net/blog/2007/07/4/

于 2009-11-05T14:57:12.920 回答