css如何实现虚线加载效果

这篇文章将为大家详细讲解有关css如何实现虚线加载效果，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。

虚线加载

.progress-4 {  width:120px;  height:20px;  -webkit-mask:linear-gradient(90deg,#000 70%,#0000 0) 0/20%;  background:   linear-gradient(#000 0 0) 0/0% no-repeat   #ddd;  animation:p4 2s infinite steps(6);}@keyframes p4 {    100% {background-size:120%}}

-webkit-mask 默认有值 repeat，不然遮罩不会有五个。

关于"css如何实现虚线加载效果"这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。