HTML：

<divclass="loader"></div>

CSS：

.loader{

width:50px;

height:50px;

border:4pxsolid#3498db;

border-top:4pxsolidtransparent;

border-radius:50%;

animation:spin1slinearinfinite;

margin:0auto;

}

@keyframesspin{

0%{

transform:rotate(0deg);

}

100%{

transform:rotate(360deg);

}

}

复制免费讲解AI专家

.loader{

width:50px;

height:50px;

border:4pxsolid#3498db;

border-top:4pxsolidtransparent;

border-radius:50%;

animation:spin1slinearinfinite;

margin:0auto;

}

@keyframesspin{

0%{

transform:rotate(0deg);

}

100%{

transform:rotate(360deg);

}

}

在这个示例中，我们创建了一个带有类名“loader”的<div>元素，并使用CSS样式定义了加载器的外观和动画效果。@keyframes规则定义了一个名为“spin”的动画，它使加载器以线性方式无限旋转。

你可以根据需要调整width、height、border、animation等属性来自定义加载器的样式和速度。这只是一个基本示例，你可以根据自己的项目需求进行更多的定制。