Fondo de degradado animado en CSS puro-auroral. CSS
| Autor: | LunarLogic |
|---|---|
| Views Total: | 4,808 |
| Sitio oficial: | Ir a la web |
| Actualizado: | August 30, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
La librería auroral. CSS permite crear un fondo de degradado animado suave usando transiciones, transformaciones y animaciones CSS3.
Funcionamiento
Descargue e inserte auroral. CSS o auroral. min. CSS en el encabezado de la Página Web.
<link rel="stylesheet" href="css/auroral.css">
Aplique las siguientes reglas CSS al elemento contenedor.
.container {
width: 100vw;
height: 100vh;
overflow: hidden;
position: relative;
} Añade el efecto ' auroral-norte ' al fondo.
<div class="container"> <div class="auroral-norte"></div </div>
Todos los efectos de fondo degradados disponibles (clases CSS).
- auroral-norte
- auroral-norte-intense
- auroral-norte-dimmed
- auroral-norte-dusk
- auroral-Agrabah
Reemplace los estilos predeterminados en el _ config. SCSS:
* {
box-sizing: border-box;
}
body {
margin: 0;
padding: 0;
}
.container {
width: 100vw;
height: 100vh;
overflow: hidden;
position: relative;
}
@mixin auroral-container() {
position: absolute;
left: -50%;
top: -50%;
width: 200%;
height: 200%;
} Registro de cambios
08/30/2018
- Actualización de CSS
