给伪类添加动画,动态显示省略号实现加载中特效,在开发者工具中都正常展示,在手机中color起作用,content修改不起作用,代码如下:
.dot::after {
width: 40rpx;
display: inline-block;
content: "";
animation: dot 1s infinite;
}
@keyframes dot {
0%, 100% {
content: "";
color: red;
}
25% {
content: ".";
color: green;
}
50% {
content: "..";
color: blue;
}
75% {
content: "...";
color: pink;
}
}
知道了,之前有人遇到过相同的问题,解决方式如下:
网址:https://www.zhangxinxu.com/wordpress/2019/06/cssconf-css-idea/ “动画打点”