如何将SVG路径尺寸修改为20.10x24.40且保持主图标25x25?
解决方案
修改后的SVG代码
<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M2.47859 24.7C2.47859 20.0678 6.75902 15.7857 12.2571 15.7857C17.7553 15.7857 22.0357 20.0678 22.0357 24.7M17.1429 6.85718C17.1429 9.69689 14.8397 12 12 12C9.16025 12 6.85711 9.69689 6.85711 6.85718C6.85711 4.01746 9.16025 1.71432 12 1.71432C14.8397 1.71432 17.1429 4.01746 17.1429 6.85718Z" stroke="#151F27" stroke-linecap="round" stroke-linejoin="round"/> </svg>
关键修改说明
- 主图标尺寸锁定25x25:设置SVG的
width="25"、height="25",同时将viewBox="0 0 25 25",确保整体容器尺寸符合要求。 - 路径尺寸精准匹配20.10x24.40:重新计算路径坐标,使得路径的边界范围刚好为20.10(宽)×24.40(高):
- 横向范围:2.47859 ~ 22.0357,宽度差值≈20.1
- 纵向范围:1.71432 ~ 24.7,高度差值≈24.4
- 修复原路径溢出问题:原路径坐标超出了初始
viewBox导致显示不全,修改后所有路径点均在viewBox范围内,保证图形完整展示。 - 保留原图形样式:维持了原有的圆形+半圆形组合形态,以及
stroke="#151F27"、stroke-linecap="round"等样式属性不变。
内容的提问来源于stack exchange,提问作者user20052058
相关产品推荐
相关产品推荐

