svg插图素材：简单漂亮的SVG开源图标库Feather icons
svg插图素材：简单漂亮的SVG开源图标库Feather icons<svg class="feather feather-[iconName]" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <use xlink:href="feather-sprite.svg#[iconName]"/> </svg>.feather { width: 24px; height: 24px; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; fill: none; }<svg class="feather fea
Feather icons 是一个简单漂亮的开源图标库，强调功能、一致性和简单性。
使用方法
引入JS文件
<script src="https://img.aigexing.compath/to/dist/Feather.js"></script>
或者
<!-- choose one --><script src="https://img.aigexing.comhttps://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> <script src="https://img.aigexing.comhttps://unpkg.com/feather-icons/dist/feather.min.js"></script>
显示图标
<i data-feather="circle"></i>
引用方法
<script> feather.replace()</script>
完整html
<!DOCTYPE html> <html lang="en"> <title></title> <script src="https://img.aigexing.comhttps://unpkg.com/feather-icons/dist/feather.min.js"></script> <body> <!-- example icon --> <i data-feather="circle"></i> <script> feather.replace() </script> </body> </html>
SVG
<svg class="feather feather-[iconName]" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <use xlink:href="feather-sprite.svg#[iconName]"/> </svg>
.feather { width: 24px; height: 24px; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; fill: none; }
<svg class="feather feather-[iconName]"> <use xlink:href="feather-sprite.svg#[iconName]"/> </svg>
完整示例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Feather</title>
<!--
To build feather.min.js run
$ npm run build
in the root directory or use the already built package available on unpkg.com.
-->
<script src="https://img.aigexing.com../dist/feather.min.js"></script>
<!-- <script src="https://img.aigexing.comhttps://unpkg.com/feather-icons/dist/feather.min.js"></script> -->
</head>
<body>
<i data-feather="eye"></i>
<i data-feather="heart"></i>
<i data-feather="feather"></i>
<script>
feather.replace()
</script>
</body>
</html>
