如何在Visual中替换SVG图标并解决新图标宽度为0不显示问题

• 重复class属性导致样式不生效
  你的新SVG中<circle>和<path>元素都重复定义了class属性：先写了class='a'，又写了class="st0"。HTML规范中同一元素重复定义同一属性时，仅第一个属性值生效，因此你的图形元素实际使用的是a类，但新SVG的样式表中仅定义了.st0的描边、填充规则，没有.a对应的样式，图形完全透明，因此看不见内容。
• viewBox与内容尺寸不匹配
  新SVG的viewBox设置为0 0 92.2 96.2，但你的搜索图标内容仅在画布中心极小区域：圆半径仅9单位，加上路径总尺寸也不足20单位。当整个92单位宽的画布缩放到21px的显示宽度时，图标内容实际渲染尺寸不足5px，就算有样式也几乎看不到。

你可以按以下步骤修改新SVG代码即可正常显示：

1. 修复class匹配问题：删掉图形元素上多余的class='a'属性，让st0类生效，或者将样式表中的.st0选择器改为.a，和元素的class对应。
2. 调整viewBox到刚好包裹图标内容，比如修改为viewBox="35 37 22 25"，让图标占满整个画布，缩放后就能正常显示为21px大小。

修改后的可用代码参考：

<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="35 37 22 25">
<style type="text/css">
    .st0{fill:none;stroke:#211632;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
</style>
<g transform="translate(0.75 0.75)">
    <circle id="Ellipse_739" class="st0" cx="44.7" cy="47.2" r="9"/>
    <path id="Line_181" class="st0" d="M50.9,53.9l3.5,3.5"/>
</g>
</svg>

内容的提问来源于stack exchange，提问作者Rick