CSS 以贝塞尔曲线为边界

Question

我们都知道可以使用 border-radius 属性 在普通 CSS 中创建圆角。是否也可以有任意的角形状，具体来说，使用 cubic-bezier?

Answer 1

绝对是，通过使用 CSS 掩码。如果您只关心形状（所以，而不是使用 CSS border 属性 时得到的 color/thickness/etc），那么设置 "border shape" 是与使用 "a clipping mask" 相同，由 border-radius 设置的形状只是用 "rectangle with rounded corners" 蒙版剪裁。

html5rocks.com 有很多以这种方式完成的绝对疯狂的边框形状示例。