Sfat rapid nu întotdeauna sari înapoi la Photoshop

În sfatul video de astăzi rapid, vom folosi cele mai puțin cunoscute medalion parametru atunci când creați umbrele boxului CSS3 pentru a modela corect planare și activ starea unui buton.


Rețineți: nu întotdeauna să faceți așa de repede să reveniți la Photoshop când aveți nevoie de câteva mici modificări. Este mai bine pentru tine (și pentru web) dacă te întrebi tu primul, "Putem realiza acest lucru cu simplu CSS?"


Abonați-vă la pagina noastră YouTube pentru a viziona toate tutorialele video!

Sursa finală

 corp marja: 200px auto;  a background: url (buton.png) fără repetare; lățime: 130px; înălțime: 130px; marja: auto; contur: nici unul; afișare: bloc; 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); raza de graniță: 90px;  a: hover -webkit-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inset 0 0 20px 6px rgba (0,0,0, .1); -moz-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inset 0 0 20px 6px rgba (0,0,0, .1); box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inset 0 0 20px 6px rgba (0,0,0, .1);  a: activă -webkit-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inset 0 0 20px 6px rgba (0,0,0, .2); -moz-box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inset 0 0 20px 6px rgba (0,0,0, .2); box-shadow: 0 0 8px 1px rgba (0,0,0, .2), inset 0 0 20px 6px rgba (0,0,0, .2); 
Cod