Html 如何使用剪辑路径在图像中设置形状

是否可以将图像设置为与

clip path

css相同的形状

原始图像

需要使用css的图像

---

您实际上不需要剪辑路径或遮罩。使用边界半径的倾斜变换可以做到这一点：

.box{
利润率：50像素；
边界半径：80px 0；
高度：300px；
背景：红色；
位置：相对位置；
背景：url(https://i.stack.imgur.com/rYeuk.jpg)中心/盖；
变换：歪斜（-7度）；
变换原点：右；
溢出：隐藏；
}
.box：：之前{
内容：“；
位置：绝对位置；
背景：继承；
前-20%；
左：0；
右：0；
底部-20%；
变换：歪斜（7度）；
}
身体{
背景：红色；
}

share what your triedIt看起来好像可以使用剪辑路径（即定义的路径）创建所需的形状，但对于复杂形状，值得查看遮罩图像。