利用css换行技术实现加载中动画效果

xiaoxiao2021-02-28  9

效果图

css代码

dot { display: inline-block; height: 1em; line-height: 1; vertical-align: -.25em; overflow: hidden; } dot::before { display: block; content: '...\A..\A.'; white-space: pre-wrap; animation: dot 3s infinite step-start both; } @keyframes dot { 33% { transform: translateY(-2em); } 66% { transform: translateY(-1em); } }

HTML代码

<a href="javascript:" class="grebtn">订单提交中<dot>...</dot></a>

更多的实现方式

这里是项目链接

转载请注明原文地址: https://www.6miu.com/read-450092.html

最新回复(0)