SVG中stroke-width属性设置无效问题求助

我看了你的SVG代码，问题其实出在描边宽度相对于画布尺寸来说太小了，导致你误以为设置没生效，当然还有一些细节可以优化，下面给你拆解：

核心原因 #

你的SVG使用了viewBox="0 0 512 512"，这意味着整个画布是512×512的像素空间，但你设置的stroke-width="0.2"在这个空间里是非常细微的线条，肉眼几乎难以分辨，所以看起来像是没生效。

另外，你的代码里存在重复设置：<g>标签和内部的<path>标签都设置了stroke-width="0.2"，虽然这不会导致失效，但属于冗余代码，建议统一在一个层级设置。

修复方案 #

1. 增大描边宽度值 #

把stroke-width调整到一个更明显的数值，比如2或者4，这样在512的画布上就能清晰看到描边了。修改后的代码示例：

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
  <g stroke="black" fill="#3F474E" stroke-width="2">
    <path d="m488 248h-32v-18.800293c7.7072754 1.8276368 15.7418213 2.800293 24 2.800293h8v-16h-8c-48.5234375 0-88-39.4765625-88-88 0-4.4179688-3.581543-8-8-8h-32c-4.418457 0-8 3.5820313-8 8 0 48.5234375-39.4765625 88-88 88s-88-39.4765625-88-88c0-4.4179688-3.581543-8-8-8h-32c-4.418457 0-8 3.5820313-8 8 0 48.5234375-39.4765625 88-88 88h-8v16h8c8.2581787 0 16.2926636-.9726563 24-2.800293v18.800293h-32c-4.418457 0-8 3.5820313-8 8v32c0 4.4179688 3.581543 8 8 8h96v32c-3.4433594 0-6.5004883 2.203125-7.5893555 5.4697266l-16 48c-.8134766 2.4404297-.4042969 5.1220703 1.0996094 7.2080078 1.503418 2.0859375 3.9179688 3.3222656 6.4897461 3.3222656h80c2.5717773 0 4.9863281-1.2363281 6.4897461-3.3222656 1.5039063-2.0859375 1.9130859-4.7675781 1.0996094-7.2080078l-16-48c-1.0888672-3.2666016-4.1459961-5.4697266-7.5893555-5.4697266v-32h176v32c-3.4433594 0-6.5004883 2.203125-7.5893555 5.4697266l-16 48c-.8134766 2.4404297-.4042969 5.1220703 1.0996094 7.2080078 1.503418 2.0859375 3.9179688 3.3222656 6.4897461 3.3222656h80c2.5717773 0 4.9863281-1.2363281 6.4897461-3.3222656 1.5039063-2.0859375 1.9130859-4.7675781 1.0996094-7.2080078l-16-48c-1.0888672-3.2666016-4.1459961-5.4697266-7.5893555-5.4697266v-32h96c4.418457 0 8-3.5820313 8-8v-32c0-4.4179687-3.581543-8-8-8zm-48 0h-16v-32.3981934c5.0522461 3.2409668 10.4038086 6.0529785 16 8.3935547zm-32-45.026123v45.026123h-16v-64.637207c4.529541 7.1740722 9.9089355 13.7592773 16 19.611084zm-64-19.611084v64.637207h-16v-45.026123c6.0910645-5.8518067 11.470459-12.4370118 16-19.611084zm-144 64.637207v-32.3981934c5.0522461 3.2409668 10.4038696 6.0529785 16 8.3935547v24.0046387zm32-18.800293c5.1953735 1.2319336 10.5383911 2.078125 16 2.4956055v16.3046875h-16zm32 2.4956055c5.4616699-.4174805 10.8046875-1.2636719 16-2.4956055v18.800293h-16zm32-7.6999512c5.5960693-2.3405762 10.9477539-5.1525879 16-8.3935547v32.3981934h-16zm-112-21.0214843v45.026123h-16v-64.637207c4.529541 7.1740722 9.9089355 13.7592773 16 19.611084zm-64-19.611084v64.637207h-16v-45.026123c6.0910645-5.8518067 11.470459-12.4370118 16-19.611084zm-48 40.6325683c5.5960693-2.3405762 10.9477539-5.1525879 16-8.3935547v32.3981934h-16zm-40 56.0046387v-16h88v16zm140.9003906 96h-57.8007813l10.6665039-32h2.2338868 32 2.2338867zm-36.9003906-48v-192h16v192zm32-48v-16h176v16zm228.9003906 96h-57.8007813l10.6665039-32h2.2338868 32 2.2338867zm-36.9003906-48v-192h16v192zm120-48h-88v-16h88z"></path>
  </g>
</svg>

2. 检查样式优先级（可选） #

如果后续还是遇到描边不生效的情况，要注意：SVG元素的直接样式会覆盖父容器的样式，比如如果<path>单独设置了stroke-width，会覆盖<g>标签的设置，所以尽量保持样式设置的一致性，避免冗余。

3. 确认描边颜色对比度 #

你的描边颜色是black，填充色是#3F474E（深灰），两者对比度不算特别高，如果你用了很小的描边宽度，也会更难分辨。可以尝试把描边改成更亮的颜色，比如white，来快速测试是否生效。

总结 #

你当前的设置其实是生效的，只是因为描边宽度在512的画布上太细微导致看不见，调整stroke-width到合适的数值就能解决问题。

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