如何通过 <use> 元素（如图像）调整 SVG 图标的大小

要通过<use>元素来调整SVG图标的大小，可以使用CSS的width和height属性或者transform属性来实现。

方法一：使用CSS的width和height属性

<svg>
  <use xlink:href="icon.svg#icon-name"></use>
</svg>

svg {
  width: 24px; /* 设置图标宽度 */
  height: 24px; /* 设置图标高度 */
}

通过设置<svg>元素的宽度和高度，可以确定<use>元素渲染的图标的大小。

方法二：使用CSS的transform属性

<svg>
  <use xlink:href="icon.svg#icon-name"></use>
</svg>

svg use {
  transform: scale(2); /* 设置图标缩放比例 */
}

通过设置<use>元素的transform属性，可以缩放渲染的图标的大小。在示例中，图标被放大了两倍。

无论使用哪种方法，都可以通过调整CSS属性的值来控制图标的大小。您还可以根据需要结合其他CSS属性（如fill和stroke）来修改图标的颜色和样式。