WEBLEB
Home
Editor
Accedi
Pro
Italiano
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Spinner dell'icona di caricamento CSS
458
ByBy.inc
Apri nell'Editor
Pubblica il Tuo Codice
Consigliato
29 July 2025
Elenco delle schede aziendali con branding e marketing
21 October 2025
Esempio di modello HTML di base
29 December 2024
Un codice di wsss
HTML
Copy
<div class="loading-icon-1"></div>
CSS
Copy
* { margin: 0; padding: 0; } body{ background: rgb(0, 0, 0); width: 100vw; height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; font-family: monospace; } /* argola no centro */ .loading-icon-1{ width: 50px; height: 50px; background: transparent; border-radius: 100%; border:solid 2px white; display: flex; align-items: center; justify-content: end; } /* after com o elemento dentro e uma animação simples de rotação 360deg com origem -50% pois o justify-content está no end */ .loading-icon-1::after{ content: '⚪'; animation:1.5s loader linear infinite; transform-origin: -50%; } /*animação simples */ @keyframes loader{ 0%{ transform: rotate(0deg); } 100%{ transform: rotate(360deg); } }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */
