El lenguaje de CSS es el que permite diseñar visualmente componentes de un sitio web, permite dar estilo, formas, colores, entre otros aspectos, en este artículo se destacan algunos efectos que se pueden conseguir gracias a CSS.
Toda acción que el usuario realiza dentro de un software o sitio web puede ser obtenida a través de eventos, en el área de Programación de Computadoras es importante conocer como capturar esos eventos de parte del usuario (cuando hace clic, doble clic, cuando desliza el mouse, cuando entra en una caja de texto...) para que el software pueda realizar acciones a partir de ello, un ejemplo se ve en CSS cuando se utiliza el evento hover (cuando se coloca el mouse sobre un objeto, ya sea imagen o botón, entre otros), con CSS podemos establecer cambios en el diseño en el momento que el usuario deslice el mouse sobre ese elemento, usando la regla button:hover.
Efectos
- Animate icon (icono animado)
- Ghost (espectro)
- Fade In (desvanecer)
- Grow In (agrandar)
- Bounce (rebote)
- Skew (sesgar)
- Hightlight border (destacar borde)
- Flip 3D (voltear)
- Shiny (brillante)
- Border double (borde doble)
Result
See the Pen CSS hover button effects by Vladimir Salguero (@vladisalguero) on CodePen.
