Crear un boton fantasma en CSS

Los botones fantasmas son botones transparentes y vacíos que tienen una forma básica como un rectángulo. Por lo general tienen una línea muy delgada en el borde, mientras que la sección interna consiste de texto. Suelen también llamarse botones “vacíos” o “huecos” y suelen ser más grandes que los botones estándar. Se los denomina fantasma porque a pesar de ser transparentes pueden captar la atención del usuario inmediatamente. Los botones fantasma van mejor con sitios y aplicaciones que tienen una interfaz minimalista que use fondos a gran escala.

Estructura:
Lo único que necesitamos para este ejemplo es un enlace que colocaremos en el centro de la pantalla y un div que lo contenga.

CSS:
Primero definimos el fondo para que muestre una imagen todo a lo ancho de la pantalla.

Modificamos la posición del div y le hacemos ocupar todo el ancho y alto de la pantalla.

Definimos las propiedades del botón.

Por ultimo agregamos las propiedades del ratón cuando se posicione en el botón.

 

Crear un boton fantasma en CSS
VOTA EL ARTICULO POR FAVOR

Share on FacebookTweet about this on TwitterShare on Google+Digg thisPin on PinterestShare on LinkedInPrint this pageEmail this to someone VOTA Y COMPARTE

Agregar comentario

*

Suscribete

Suscribete a nuestro newsletter y mantente informado con nuestros últimos artículos, noticias y más. Todo completamente gratis.

Tu suscripción a sido realizada con éxito.