保持内部SVG的纵横比

Answer 1

您可以使用CSS属性aspect-ratio。

p {
  color: navy;
}

.inline {
  fill: currentColor;
  display: inline-block;
  height: 1em;
  aspect-ratio: 828/1000;
}

<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" style="position: absolute;">
    <defs>
        <symbol id="image1" viewBox="-10 0 828 1000">
            <path fill="currentColor" d="M -10 50 L 818 0 L 690 1000 L 40 700 Z" />
        </symbol>
    </defs>
</svg>
<p>Here is your inline <svg class="inline"><use href="#image1" /></svg> SVG.</p>