效果图：
完整代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>加载动画</title>
<style type="text/css">
/* 设置页面背景颜色 */
body {
background: #ECF0F1;
}
/* 定义加载动画容器的样式 */
.load {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
/* 根据项目需求调整宽度和高度 */
width: 100px;
height: 100px;
}
/* 设置每个圆形的样式 */
.load hr {
border: 0; /* 去掉默认边框 */
margin: 0; /* 去掉默认外边距 */
width: 40%; /* 设置圆形的宽度 */
height: 40%; /* 设置圆形的高度 */
position: absolute; /* 绝对定位 */
border-radius: 50%; /* 圆形边框 
![[CAN] 创建解析CAN报文DBC文件教程](https://img-blog.csdnimg.cn/direct/4e79b98c4b3d4a92a123b481a4a6d698.png#pic_center)
