css - 带有 CSS 的自定义大小 .ico

Question

我想用 CSS 定义加载的 .ico 文件的大小，因为 FireFox 和 Chrome 中的默认值不同。

我的链接的 HTML 代码：

<a href="https://www.google.com/maps/place/##keyword##" target="_blank" title="show on map" class="showonmap">##keyword##</a>

以及相应的 CSS 代码：

.showonmap {
    background: url("images/gmaps3.ico") no-repeat scroll right center rgba(0, 0, 0, 0);
    padding-right: 20px;
}

http://jsfiddle.net/eapo/yy8gqt3f/1/（用不同的浏览器查看问题）

我希望我可以在不“更改文件类型”、“用作元素”的情况下解决这个问题

Answer 1

使用background-size：

.showonmap {
    background: url("https://maps.gstatic.com/favicon3.ico") no-repeat scroll right center rgba(0, 0, 0, 0);
    padding-right: 20px;
    background-size: 15px 15px;
}

演示：http: //jsfiddle.net/yy8gqt3f/2/

---

您还可以制作图像100%高度，保持原始纵横比：

background-size: auto 100%;

演示：http: //jsfiddle.net/yy8gqt3f/4/