Is there any reason to use css box-shadow over drop-shadow?
-
26-06-2021 - |
题
Assuming client compatibility, is there any situation where CSS box-shadow
is preferable to filter: drop-shadow
.
From the article it seems like drop-shadow
is a HW accelerated superset of box-shadow
. This means that we should basically always use drop-shadow
instead of box-shadow
?
解决方案
There is only one difference between box-shadow
and filter: drop-shadow
. With box-shadow
you can use inset shadows, but you can't do it with filter: drop-shadow
. All depended on you. Check this example.
Why is better to use box-shadow
insted of filter: drop-shadow
?
- Better browser support
- Most of developers use it
- Less code, more options
- You can use inset shadows
- You can use more than one shadow
Also, there is one example with image where is better to use filter: drop-shadow
. The first one has rectangle shadow, but the other one has shadow which follow the edge of image.
其他提示
Problem is that there is limited browser support for filter
at the moment with box-shadow
being much more supported.