CSS圆形边框

时间:2013-12-07 18:13:31

标签: html css html5 forms css3

我有一张表格,我想绕过您在下面看到的边框的一角。我希望勾勒出形式的边框能够满足并圆润。

  

enter image description here

我尝试过border-radius方法,但它产生了这个。它围绕容器,这是我不想要的。

  

enter image description here

我还看了一下CSS border-style属性,但是没有选项可以选择边框的圆角交点。如果有人可以提供帮助,那将非常感激!

修改

我用HTML和CSS创建了JSFiddle

3 个答案:

答案 0 :(得分:4)

由于标签而删除了第一个角落。这是一个 FIDDLE

.tab-content {
  border-radius: 0 30px 30px 30px;
  -moz-border-radius: 0 30px 30px 30px;
  -webkit-border-radius: 0 30px 30px 30px;
}

答案 1 :(得分:2)

你想要的是:

.tab-content{
    -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

http://jsfiddle.net/stryd3r/vB3m2/1/

答案 2 :(得分:0)

border-radius提供给您的容器时,请将其提供给表单。 :)