圆角和圆角HTML中的椭圆形状按钮

Question

我想创建一个圆角和椭圆形的HTML按钮，没有图像。 这样做的方法是什么？

Answer 1

这使得所有方面都圆了：

border-radius:40px;

这使它们成为椭圆形：

border-radius:40px/24px;

看看这里：

http://jsfiddle.net/xnTZq/

或者有一些额外丑陋的幻想：

http://jsfiddle.net/xnTZq/6/

Answer 2

-webkit-border-radius:3em / 1em;
-moz-border-radius:3em / 1em;
border-radius:3em / 1em;

Answer 3

#box-1 {
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   -border-radius:10px;
}

此框应该有适用于Firefox，Safari / Chrome，Opera和IE9的圆角。

如果您需要更多帮助，这是一篇非常有用的文章：

http://www.css3.info/preview/rounded-border/

Answer 4

可能使用css3 border-radius并保持较小的高度以获得椭圆形状，用于跨浏览器支持的良好站点（当然仅支持css3的浏览器，除非您使用css3 pie http://css3pie.com/）{{3 }}

koolies