It's time to use Filter:drop-shadow.

A few days ago in doing a project, use the Shadow, shadow is a direction all have, so wrote a big Tuo Box-shadow to realize, and then today see Bricss said Filter:drop-shadow, suddenly enlightened.

The implementation of the specific need not be detailed, look directly at the code:

Box-shadow programme:

1 2 3

. Box-shadow { Box-shadow:rgba (0,0,0,.5) 0 1px 5px; }

Drop-shadow Filter Scheme:

1 2 3 4 5 6 7

. Filter-drop-shadow { -webkit-filter:drop-shadow (0 1px 5px rgba (0,0,0,.5)); -moz-filter:drop-shadow (0 1px 5px rgba (0,0,0,.5)); -ms-filter:drop-shadow (0 1px 5px rgba (0,0,0,.5)); -o-filter:drop-shadow (0 1px 5px rgba (0,0,0,.5)); Filter:drop-shadow (0 1px 5px rgba (0,0,0,.5)); }

Effect comparison:

On-line demo:http://dabblet.com/gist/3820382

About Drop-shadow This filter:

• Students who do not know the filter please visit:-webkit-filter is God horse?
• Chrome has been supported from version 21 (now the mainstream version), Safari 6 and iOS 6 Safari support
• Firefox, Opera, ie continue to use Box-shadow Bar

Filter specification now by WebKit and Adobe in the Push, Firefox in the follow-up, IE10 also support a little bit, so on the WebKit, can achieve better results, why not?

Reference: http://bricss.net/post/33158273857