位置背景图片没有内幕

Question

下午好stackoverflow社区，

我有一个文件里面有一些图像，我想分别使用这个图像的每个部分而不创建不同的文件。所以我开始寻找通过CSS提供位置的方法来“切断”我要展示的作品。

我尝试使用像clipwithout成功的属性。我得到的最接近的是在DIV中插入一些随机文本时给出高度和背景位置。

这是我演示它的一个小提琴，但由于我无法更新图像，我只是用背景色制作。

.icon {
float: left;
background-color:#6495ED;
background-position: 0 0px;
height: 29.2px;
}   

http://jsfiddle.net/PatrickBDC/HaGNa/

有没有办法显示背景，大小相同但没有文字？

非常感谢！

Answer 1

如果div为空，您还需要为div设置宽度。试试这样的事情

.icon {
float: left;
background: url () no-repeat 0 0;
height: 29.2px;
width:60px;
}   

Answer 2

如果您希望div显示没有内容，则需要在CSS中指定宽度：

.icon {
        float: left;
        background-color:#6495ED;
        background-position: 0 0px;
        height: 29.2px;
        width: 50px;
    }   

这是a working fiddle。

Answer 3

只需在代码中添加width: 100px;和height: 50px;属性即可。您可以根据要显示的图片部分添加width和height。