-1

我在我的网站上使用了几个带圆圈的图标，它看起来非常好，但是当仔细观察它时，我可以在所有四个方向上看到直边。我放大，我可以清楚地看到它。我尝试使用带有所有选项的图像渲染，但无法修复它。在 Photoshop 上它看起来像一个完整的圆圈，但在网站上，它没有正确显示。

background-image: url("../images/location.png") no-repeat;
background-size: 300px auto;
background-position: -10px -10px;
height: 25px;
left: 2px;
top: 10px;
width: 25px;
image-rendering: auto;

我尝试了所有其他图像渲染选项，但没有运气。这是我的图片：

在此处输入图像描述

如果你仔细观察，你实际上可以看到直线。这是放大时的直线 在此处输入图像描述

4

1 回答 1

0

这是一个使用 1600x1600px 图标和 72ppi 的工作示例：

https://jsfiddle.net/v319jLde/14/

//depending means the max value in px you need to show the icon.

你不需要使用这么大的尺寸，但是设置一个 150ppi 的 [depending] px，你会得到一个很好的视图，使用它可以调整到你需要的 [depending] px 的 50px。

如果你放大一个图标，它肯定会像预期的那样降低质量，而不是你把它做成 svg 格式。

您可以使用字体真棒图标或字形图标，并通过良好的行为调整其大小，请查看此组合的底部：

http://joelbonetr.com/

于 2018-03-01T12:26:30.583 回答