En el video rápido de hoy, usaremos el menos conocido. recuadro
parámetro al crear las sombras de la caja CSS3 para dar un estilo adecuado a la flotar
y activo
estados de un botón.
Recuerde: no siempre sea tan rápido para volver a Photoshop cuando necesite algunos cambios pequeños. Es mejor para usted (y para la web) si primero se pregunta: "¿Podemos lograr esto con CSS simple?"
cuerpo margen: 200px auto; a background: url (button.png) no-repetir; ancho: 130px; altura: 130px; margen: auto; esquema: ninguno; bloqueo de pantalla; texto-sangría: -10000px; -webkit-box-shadow: 0 0 8px 1px rgba (0,0,0, .2); -webkit-border-radius: 90px; -moz-box-shadow: 0 0 8px 1px rgba (0,0,0, .2); -moz-border-radius: 90px; box-shadow: 0 0 8px 1px rgba (0,0,0, .2); radio del borde: 90px; a: flotar -webkit-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), recuadro 0 0 20px 6px rgba (0,0,0, .1); -moz-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), recuadro 0 0 20px 6px rgba (0,0,0, .1); box-shadow: 0 0 8px 1px rgba (0,0,0, .2), recuadro 0 0 20px 6px rgba (0,0,0, .1); a: activo -webkit-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), recuadro 0 0 20px 6px rgba (0,0,0, .2); -moz-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), recuadro 0 0 20px 6px rgba (0,0,0, .2); box-shadow: 0 0 8px 1px rgba (0,0,0, .2), recuadro 0 0 20px 6px rgba (0,0,0, .2);