为什么我的 SVG 没有显示为抗锯齿？答案

【问题标题】：Why is my SVG not showing as anti-aliased?为什么我的 SVG 没有显示为抗锯齿？
【发布时间】：2020-05-01 17:57:44
【问题描述】：

无论我做什么，我的徽标都不会在我的 HTML 页面中消除锯齿。这个问题很烦人，我似乎在网上根本找不到任何解决方案。是什么导致这种情况发生？在 Chrome 上本地查看矢量图形时正常显示，但边缘在 HTML 中呈锯齿状。什么给了？

HTML 代码：

<div class="logo">
  <img src="img/logo.svg"></img>
</div>

CSS 代码：

.logo {
  display: block;
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-bottom: 5px;
  align-self: end;
}

【问题讨论】：

【解决方案1】：

更新：我解决了这个问题，这是我从图像编辑应用程序 (Inkscape) 中导出它的方式

【讨论】：