是否可以生成遵循剪切路径多边形形状的盒形阴影? [英] Is it possible to generate a box-shadow that follows the shape of a clip-path polygon?

问题描述

假设我有此剪辑路径(在此处)生成的三角形)

Let's say I have this clip path (a triangle generated here)

-webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
clip-path: polygon(50% 0%, 0% 100%, 100% 100%);

是否可以从此剪辑路径创建盒形阴影? 像这样:

Is it possible to create a box-shadow from this clip path? Something like this:

box-shadow: 20px 25px 50px -25px #000;

推荐答案

您可以在包含的div上使用过滤器，请尝试:

You can use a filter on the containing div, try:

.container {
   filter: drop-shadow(0px 10px 5px rgba(0,0,0,0.1))
}

例如: https://plnkr.co/edit/kePuv7OLQwawPjiBLg3J?p=preview

这篇关于是否可以生成遵循剪切路径多边形形状的盒形阴影?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！