如果不用图片和JS，可以只用CSS实现下面的层效果吗？带三角的层，并且边框和填充的颜色不一样

那个三角的部分如果要带边框，纯CSS稍微复杂一点，用两个三角一个大一点的一个小的，然后绝对定位一下，大的三角放下面作为三角形的边框，小的放上面颜色和矩形框背景色一样。其他都比较简单了。
如果非要用纯CSS，我只发现这种方法。
---------
JviEII的方法兼容性不错，如果不打算支持IE6 7的话，可以用after伪类来制造三角元素，不过不好带边框了。

如果用CSS3的话就更简单了，after伪类，然后transform旋转45度就可以搞定了。
其实你大可以为低版本浏览器使用图片，高版本浏览器使用CSS3，达到平稳退化。

写了个简单的，如果要想三角也带边框，需要写两个重合。

html,body{margin:0;padding:0;background:#FFF;}
.center{width:50px;margin:50px auto;}
.up {                                        
  width:0px;
  height:0px;
  border-bottom:10px solid #600;
  border-left:10px solid #fff;
  border-right:10px solid #fff;
}
.content{width:400px;height:200px;border:2px solid #600;background:#CCC;}