WEBLEB
Inicio
Editora de código
Iniciar sesión
Pro
Español
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Icono giratorio de carga CSS
768
byby.createsite
Abrir en el editor
Publica tu código
Recomendado
4 January 2025
Un bucle cuadrático con CSS
4 May 2025
Un código de Mete
25 November 2025
Plantilla HTML para sitio web de películas | Adaptable y con filtros
HTML
Copy
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) */