Nel suggerimento rapido del video di oggi, useremo il meno conosciuto inserire
parametro durante la creazione di ombre casella CSS3 per lo stile appropriato librarsi
e attivo
stati di un pulsante.
Ricorda: non sempre essere così veloce a tornare a Photoshop quando hai bisogno di alcune piccole modifiche. È meglio per te (e per il web) se ti chiedi per prima cosa, "Possiamo farlo con semplici CSS?"
body margin: 200px auto; a background: url (button.png) no-repeat; larghezza: 130 px; altezza: 130 px; margine: auto; contorni: nessuno; blocco di visualizzazione; text-indent: -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); border-radius: 90px; a: hover -webkit-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inserto 0 0 20px 6px rgba (0,0,0, .1); -moz-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inserto 0 0 20px 6px rgba (0,0,0, .1); box-shadow: 0 0 8px 1px rgba (0,0,0, .2), riquadro 0 0 20px 6px rgba (0,0,0, .1); a: active -webkit-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inserto 0 0 20px 6px rgba (0,0,0, .2); -moz-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), riquadro 0 0 20px 6px rgba (0,0,0, .2); box-shadow: 0 0 8px 1px rgba (0,0,0, .2), riquadro 0 0 20px 6px rgba (0,0,0, .2);