html - tabla - ¿Cómo hago las esquinas redondeadas solo en la parte superior del borde en css?

css imagen esquinas redondeadas

Question

En mi sitio necesito hacer un div con esquinas redondeadas solo en las esquinas superiores. Pero no sé cómo hacer esto. ¿Alguien me puede ayudar?

Answer 1

La respuesta de Brendan es correcta, pero para obtenerla en más navegadores, debe usar esto:

-moz-border-radius: 0px;
-webkit-border-radius: 3px 3px 0px 0px;
border-radius: 3px 3px 0px 0px; 

Answer 2

Las otras respuestas son correctas pero hay una solución abreviada:

border-radius: 3px 3px 0 0; 

que redondeará solo las esquinas superiores y dejará las inferiores solo. El orden de los valores es en el sentido de las agujas del reloj: superior izquierda, superior derecha, inferior derecha, inferior izquierda.

Aquí hay un ejemplo: http://jsfiddle.net/9sXWf/

Answer 3

border-top-left-radius: 3px;
border-top-right-radius: 3px;