如何为SVG整体设置等效于vector-effect="non-scaling-stroke"的属性？

没有直接能应用在<svg>标签上的等效属性，但你完全不用逐个给path加属性，用CSS就能批量搞定：

• 全局CSS批量设置：直接写一行CSS，就能让页面里所有SVG中的path都应用non-scaling-stroke效果：

  svg path {
    vector-effect: non-scaling-stroke;
  }
  

• SVG内部内嵌样式：如果是独立的SVG文件，或者不想影响全局样式，可以在SVG内部加<style>块，只对当前SVG的path生效：

  <svg viewBox="..." xmlns="http://www.w3.org/2000/svg">
    <style>
      path { vector-effect: non-scaling-stroke; }
    </style>
    <!-- 你的所有path元素 -->
  </svg>
  

原因是vector-effect属于元素级属性，SVG的默认继承规则里不包含它，所以直接加在<svg>根标签上不会传递给子元素。用CSS选择器批量命中所有path，是最省事的替代方案，效果和逐个加属性完全一致。

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