css 加载的三个点 . .. ...

<div class="desc animation" v-else>正在思考中<span class="dots"></span></div>

.animation {
@keyframes dot {
0%,
20% {
content: '';
}
40% {
content: '.';
}
60% {
content: '..';
}
80%,
100% {
content: '...';
}
}
.dots::after {
display: inline-block;
animation: dot 1.5s steps(1, end) infinite;
content: '';
}
}

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一、CSS中的属性和取值 1.文本类属性: text-align属性:此标签内容的水平对齐方式,内容须为具体文字/...
    刘远舟阅读 522评论 0 1
  • 6.布局 布局:将元素以正确的大小摆放在正确的位置上。 display属性:设置元素的显示方式。block | i...
    hyt222阅读 409评论 0 0
  • CSS世界 1. 概念 三种盒子display: block; 外在的“块级盒子”和内在的“块级容器盒子”dis...
    汨逸阅读 323评论 0 1
  • fullPage运动的实例 第一屏的制作思路:要实现动画效果,就必须给需要运动的元素添加定位布局;在添加定位布局时...
    果木山阅读 809评论 0 1
  • a标签去除原颜色(改为白色)和下划线 text-decoration: none; color: #ffffff;...
    Lins7阅读 676评论 0 0