css - 带有角半径的div周围的CSS3渐变边框

Question

我正在尝试在每个角的角半径为 32px 的 div 周围创建一个 40px 的粗边框，然后渐变向中心淡出。不确定这是否是解释它的最佳方式，所以我制作了一个 jsFiddle 试图模仿我需要的东西，但它已经关闭了。

http://jsfiddle.net/c7uYh/

there's too much code to post on here neatly.

编辑当您查看 jsFiddle 的输出时，您会发现边角与顶部和底部的渐变不匹配。有明显的边缘可见。

我怎样才能让它匹配？

Answer 1

我只是框阴影而不是太多废话来处理......为什么不会有选项告诉渐变跟随形状。>>>(?)<<<<< 但是边框渐变可以工作..

- _ -

http://jsfiddle.net/HwCyf/1/

div{
    display:inline-block;

}
#m {
    box-shadow:0 0 60px 35px white;
    width:300px;
    height:200px;
    margin:36px; border-radius:20px; 
    background-color:white;}

#b {
    background-color:rgb(231, 105, 255);
    border-radius:30px; border:1px solid purple;
}