css设置svg高度和宽度

Question

请问怎么通过css设置svg标签的尺寸(不通过html)?
感谢解惑

Answer 1

<svg version="1.1" viewBox="64 64 896 896" class="icon">
  <path
    pid="0"
    d="M280 752h80c4.4 0 8-3.6 8-8V280c0-4.4-3.6-8-8-8h-80c-4.4 0-8 3.6-8 8v464c0 4.4 3.6 8 8 8zm192-280h80c4.4 0 8-3.6 8-8V280c0-4.4-3.6-8-8-8h-80c-4.4 0-8 3.6-8 8v184c0 4.4 3.6 8 8 8zm192 72h80c4.4 0 8-3.6 8-8V280c0-4.4-3.6-8-8-8h-80c-4.4 0-8 3.6-8 8v256c0 4.4 3.6 8 8 8zm216-432H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-40 728H184V184h656v656z"
  ></path>
</svg>
<style>
  .icon {
    width: 30px;
    height: 40px;
  }
</style>

Answer 2

需要给 svg 添加 preserveAspectRatio 属性，这样设置宽高才会强制拉伸，适应容器

<svg preserveAspectRatio="none">
...
</svg>