Css 如何将图像精灵放置在高度未知的元素底部

我使用的是一个由四个子图像组成的图像精灵：一个

div

元素的四个角。精灵是40px乘40px。每个“子映像”是20px乘20px。每个角的“子图像”位于精灵的另一个角，它将位于dev元素上。例如，左上角的子图像位于精灵的右下角

这个

div

元素是440px宽，100%高。我已经把顶角弄下来了，但是我怎么才能把底角弄下来？有没有一种方法可以做到这一点而不创建一个新的精灵？以下是我到目前为止对CSS规则的了解

background: -20px -20px no-repeat url(<path>), 420px -20px no-repeat url(<path>);

background:-20px-20px无重复url（），420px-20px无重复url（）；

将

背景图像

放在

绝对

位置正确的伪元素上

对不起，误读了你的问题，这里有一个“精灵”的相同技巧：

---

我不知道直接使用CSS是否可行。您可能需要打开一些JavaScript，获取元素的高度，并用该值调整精灵的CSS。如果要这样做，我想我也必须调整浏览器的大小。我宁愿使用两个精灵，而不是使用JS：（在这种情况下，这肯定是比JavaScript更好的方法。这样你就不必把自己与对面的角图像混淆，你可以有一个“顶部”精灵和一个“底部”精灵（尽管仍然是相对的边缘）。