Стиль CSS: Кривизна края стола (только верх)

Question

Я пытаюсь сделать верхний левый и верхний правый конец круговой таблицы, но применение следующего кода также приведет к нижнему левому и нижнему правому кругу. Любая идея, как это исправить?

/* sets the curvature of the box */ 
border-radius: 10px; 
-moz-border-radius: 10px; 
-webkit-border-radius: 10px; 
-o-border-radius: 10px; 

Answer 1

Specify только верхний левый и верхний правый:

-webkit-border-top-left-radius: 10px; 
-webkit-border-top-right-radius: 10px; 
-moz-border-radius-topleft: 10px; 
-moz-border-radius-topright: 10px; 
border-top-left-radius: 10px; 
border-top-right-radius: 10px; 

border-radius.com является полезным инструментом для быстрого создания радиуса границы таким образом.

Answer 2

Используется для этого

border-radius: 10px 10px 0 0; 
-moz-border-radius: 10px 10px 0 0; 
-webkit-border-radius: 10px 10px 0 0; 
-o-border-radius: 10px 10px 0 0; 

Answer 3

Вы можете указать каждый уголок границы с этим свойством. Это происходит следующим образом:

border-radius: [top-left] [top-right] [bottom-left] [bottom-right] 

border-radius: 10px 10px 0px 0px; 
-moz-border-radius: 10px 10px 0px 0px; 
-webkit-border-radius: 10px 10px 0px 0px; 
-o-border-radius: 10px 10px 0px 0px; 

Answer 4

Используйте следующий код и он будет работать

-moz-border-radius-topleft: 10px; 
-moz-border-radius-topright: 10px; 
-webkit-border-top-left-radius: 10px; 
-webkit-border-top-right-radius: 10px; 
border-top-left-radius: 10px; 
border-top-right-radius: 10px;