SCSS - 获取图像尺寸

sis*_*onb 6 css sass

我正在使用该inline-image函数来创建图标类.这是我目前的SCSS:

.folder {
    background: inline-image("icons/home/folder.png", 'image/png') no-repeat center;
    height: 30px;
    width: 41px;
}
Run Code Online (Sandbox Code Playgroud)

我正在寻找一个可以确定图像宽度和高度的函数,所以我可以这样做:

.folder {
    background: inline-image("icons/home/folder.png", 'image/png') no-repeat center;
    height: image-height("icons/home/folder.png", 'image/png');
    width: image-width("icons/home/folder.png", 'image/png');
}
Run Code Online (Sandbox Code Playgroud)

有这样的事吗?

wel*_*n97 9

找到了这个http://compass-style.org/reference/compass/helpers/image-dimensions/

你已经猜到了正确的函数名称.

要使用它们,您需要安装指南针.

它将是这样的:

@import "compass/helpers";

.folder {
    background: inline-image("icons/home/folder.png", 'image/png') no-repeat center;
    height: image-height("icons/home/folder.png");
    width: image-width("icons/home/folder.png");
}
Run Code Online (Sandbox Code Playgroud)

顺便说一句,我建议你使用精灵图标:http: //compass-style.org/reference/compass/helpers/sprites/