用两个层
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312">
<title></title>
</head>
<body>
<div style="height:22px;width:302px;border-right:1px #ccc solid;border-bottom:1px #ccc solid;">
<div style="height:20px; width:300px;border:1px #333 solid;"></div>
</div>
</body>
</html>
这样由于边框是1px 但如果边框加宽后，那个阴影和内边框是平行的，效果又太假..
只用css很难做出来，或者是做出来了兼容性也太差，而且搞不好代码也很长...
不如直接做一个图片 只做阴影部分，直接放在层里当背景，而且这样的图片体积也会很小