这是一个公共 HTML 组件库，您可以在您的网页中自由引用它们。
[!NOTE] 不是所有的组件都是高度自定义的，如果您不满足部分组件的效果，可以复制代码到您自己的网站上。
没有在此目录的组件仍然在优化，您也可以到项目目录复制它们。
您可以快速添加代码到您的页面，结构应如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>回到页面顶部按钮</title>
</head>
<body>
// 省略
<button id="scrollToTopBtn">⬆️</button> // 显示组件
<script src="https://sysyz-itcom.github.io/doc/components/js/up.js"></script> // 引入组件
</body>
</html>
您可以快速添加代码到您的页面，结构应如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>图片懒加载</title>
</head>
<body>
// 省略
<img class="lazy" data-src="image1.jpg" alt="1" width="600" height="400">
// 省略
<script src="https://sysyz-itcom.github.io/doc/components/js/lazy-img.js"></script> // 引入组件
</body>
</html>
您可以快速添加代码到您的页面，结构应如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>自动更新页脚年份</title>
</head>
<body>
// 省略
<footer>
<p>© <span id="year"></span>版权所有</p>
</footer>
// 省略
<script src="https://sysyz-itcom.github.io/doc/components/js/year.js"></script> // 引入组件
</body>
</html>