I dagens snabba snabbspets använder vi de mindre kända infälld
parameter när du skapar CSS3-boxskuggor för att ordentligt utforma sväva
och aktiva
tillstånd av en knapp.
Kom ihåg: Var inte alltid så snabb att hoppa tillbaka till Photoshop när du behöver några små förändringar. Det är bättre för dig (och webben) om du först frågar dig själv, "Kan vi uppnå detta med enkel CSS?"
kropp margin: 200px auto; en background: url (button.png) no-repeat; bredd: 130px; höjd: 130px; marginal: auto; kontur: ingen; display: block; textindelning: -10000px; -webkit-box-skugga: 0 0 8px 1px rgba (0,0,0, .2); -webkit-gräns-radien: 90px; -moz-box-skugga: 0 0 8px 1px rgba (0,0,0, .2); -moz-gränsen-radien: 90px; boxskugga: 0 0 8px 1px rgba (0,0,0, .2); gränsstråle: 90px; a: svep -webkit-box-skugga: 0 0 8px 1px rgba (0,0,0, .2), inmatning 0 0 20px 6px rgba (0,0,0, .1); -moz-box-skugga: 0 0 8px 1px rgba (0,0,0, .2), inmatning 0 0 20px 6px rgba (0,0,0, .1); boxskugga: 0 0 8px 1px rgba (0,0,0, .2), inmatning 0 0 20px 6px rgba (0,0,0, .1); a: aktiv -webkit-boxskugga: 0 0 8px 1px rgba (0,0,0, .2), inmatning 0 0 20px 6px rgba (0,0,0, .2); -moz-box-skugga: 0 0 8px 1px rgba (0,0,0, .2), inmatning 0 0 20px 6px rgba (0,0,0, .2); boxskugga: 0 0 8px 1px rgba (0,0,0, .2), inmatning 0 0 20px 6px rgba (0,0,0, .2);