css骨架屏
2025-01-14 18:36:33
66
css 实现高性能骨架屏
css 实现思路
*[loading="true"] > div:not([loading="true"]) {
background-size: 400% 100% !important;
background-image: linear-gradient(90deg, #f0f2f5 25%, #e6e8eb 37%, #f0f2f5 63%) !important;
animation: skeleton-loading 1.4s infinite ease !important;
border: none !important;
}
*[loading="true"] > div:not([loading="true"]){
display: none;
}
@keyframes skeleton-loading {
0% {
background-position: 100% 50%;
}
100% {
background-position: 0 50%;
}
}
vue 指令 待更新