无法获得某些剪辑路径

Question

我知道这非常简单，但我似乎无法在此示例中使用简单的椭圆屏蔽：

http://jsfiddle.net/foomarks/m5272/3/

img {
position: absolute;
-webkit-clip-path: ellipse(200px,200px,50px,100px);    
}

任何人都有任何关于我做错的提示。

（我的理解是没有必要为基本形状创建SVG路径：http://www.html5rocks.com/en/tutorials/masking/adobe/）

Answer 1

形状的语法在今年年初发生了变化。

这是：

• inset(<margin>[ round <border-radius>]?)表示矩形 - demo（<margin>和<border-radius>值与margin和border-radius属性的值完全相同）
• circle([<radius>]?[ at <position>]?)代表圈圈 - demo（类似于指定径向渐变的方式）

• ellipse([<radius>{1,2}]?[ at <position>]?)代表椭圆 - demo

• 通用多边形

相同

Chrome 34 +，Opera 21+和Safari 8支持新的形状语法。

此外，该文章中提到的clip属性已被弃用。