loading.css 613 B

1234567891011121314151617181920212223242526272829303132333435
  1. /* Loading容器样式 */
  2. #loading-overlay {
  3. position: fixed;
  4. top: 0;
  5. left: 0;
  6. width: 100%;
  7. height: 100%;
  8. background: #efefef;
  9. z-index: 9999;
  10. display: none;
  11. justify-content: center;
  12. align-items: center;
  13. transition: opacity 0.3s;
  14. }
  15. /* 旋转动画样式 */
  16. .spinner {
  17. width: 50px;
  18. height: 50px;
  19. border: 5px solid white;
  20. border-top: 5px solid #3498db;
  21. border-radius: 50%;
  22. animation: spin 1s linear infinite;
  23. }
  24. @keyframes spin {
  25. 0% { transform: rotate(0deg); }
  26. 100% { transform: rotate(360deg); }
  27. }
  28. /* 显示时样式 */
  29. .active {
  30. display: flex !important;
  31. opacity: 1;
  32. }