您好,當前正在加載 CSS 動畫。
.loading { position: relative; /* 設置相對定位 */ margin: 0 auto; /* 使其在水平方向居中 */ width: 50px; height: 50px; } .loading:before { content: ""; position: absolute; /* 設置絕對定位 */ top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; border: 4px solid #f3f3f3; border-top-color: #16a085; animation: spin 1.5s linear infinite; /* 使用動畫 */ } @keyframes spin { /* 定義動畫 */ to { transform: rotate(360deg); } }
以上為加載動畫的 CSS 代碼示例,它使用了 :before 偽元素來創建一個圓形,然后使用動畫實現旋轉效果。在頁面加載時,這段代碼會被執行并顯示出來,以提示用戶正在加載內容。當加載完成后,該元素不再顯示。
感謝您的閱讀,祝您使用愉快!
上一篇正在加載中css