svg symbol
<body>
<!-- 使用svg -->
<svg class="svg-icon text-blue-500" style="font-size: 5rem" aria-hidden="true">
<use xlink:href="#icon-photo" fill />
</svg>
<!-- 注册svg -->
<svg style="position: absolute; width: 0px; height: 0px; overflow: hidden;">
<symbol xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.25 15.75l5.159-5.159a2.25 2.25 0 013.182 0l5.159 5.159m-1.5-1.5l1.409-1.409a2.25 2.25 0 013.182 0l2.909 2.909m-18 3.75h16.5a1.5 1.5 0 001.5-1.5V6a1.5 1.5 0 00-1.5-1.5H3.75A1.5 1.5 0 002.25 6v12a1.5 1.5 0 001.5 1.5zm10.5-11.25h.008v.008h-.008V8.25zm.375 0a.375.375 0 11-.75 0 .375.375 0 01.75 0z" />
</symbol>
</svg>
</body>
使用symbol注册svg的优点：
- 复用
- 拓展性高：支持宽度、高度、颜色等属性修改
使用场景
从后端或某个目录下获取svg字符串，然后注册到body后，供当前页面使用
标签：body,svg,symbol,注册,使用,模板 From： https://www.cnblogs.com/zhuxiang1633/p/17152661.html