我从来没有尝试过.我创建了一个包含两个图标的图像精灵.每个图标宽26像素和高.所以精灵是26x52px.
我有一个元素在div.something或div.anything.根据哪一类,我想在左边或右边添加一个角帽.
所以我定位的.element相对,应用:在pseudoclass之前img和位置它绝对的高度和宽度26px,所以只有一个图标的精灵适合我也应用“溢出:隐藏”在要隐藏sprite上的第二个图标.
.element { position:relative; } .element:before{ content: url("../images/sprite.png"); position: absolute; height:26px; width:26px; overflow:hidden; } .something .element:before { top: -2px; left: -2px; } anything .element:before { top: -28px; right: -2px; }
这在左角使用,精灵中第一个顶部图标.
不过,现在我想知道如何才能在sprite中显示“任何东西.element”的第二个图标.
所以实际上,“面具”应该位于-2px,-2px,但是sprite img里面应该以-26px开头,所以显示第二个图标.
这样可以用css这样做吗?