There are a couple of techniques. The one I would suggest looking at is what is generally known as sliding door. A demo/tutorial for it is here: css sliding door.Most use this technique for buttons or tabs but it can be expanded to work with four corners. You will need images for the corners and the background (especially if you have a gradient if no gradient can just have images for the corner pieces).
There's a css3 technique you can use as well, but it only works in Chrome and Firefox, IE hasn't provided support for it yet.
If IE isn't an important browser for your viewers, you can use this block of code in your css:
For all four corners:
-moz-border-radius: 5px;(rounds all four corners at a 5 pixel radius for firefox)
-webkit-border-radius: 5px;(rounds all four corners at a 5 pixel radius for chrome)
For individual corners:
-moz-border-radius-bottomleft: 5px;(rounds the bottom left corner for 5px in firefox)
-webkit-border-bottom-left-radius: 5px;(rounds bottom left corner for 5px in chrome)
} (to do multiple corners, copy the line of code and replace (bottom) and (left) with desired corner placements, i.e. (top) (right) etc.)
I'd like to reiterate though, that this DOES NOT work in IE. In IE, the only way to achieve this remains using background images.
Always use all three bits of code when you want rounded corners.
Next, you face the problem of IE, which doesn't recognise these styles at all (until IE9 comes out, I think). I use dd_roundies.js for IE. So you Do not need to use images and lots of extraneous code for IE.
This combination is very easy to use. The only snag pops up when you use rounded corners AND drop-shadows on the same div, as DD gets confused a bit by IE's special filters. So it's round corners or shadows for IE, while you can use both for all other browsers