最简单的就是<div style="width:960pxmargin:0px autoheight:20pxoverflow:hiddenbackground:red"></div>
还有就是把那个当边框使用,<div style="width:960pxmargin:0px autooverflow:Hidddenheight:10pxborder-bottom:20px solid red"></div>
这两个是比较常用的,渐变的话就拿小个的图片横向平铺过去就可以了
<style type="text/css">div#nifty{ margin: 0 10%background: #9BD1FA}
p {padding:10px}
div.rtop, div.rbottom{display:blockbackground: #FFF}
div.rtop div, div.rbottom div{display:blockheight: 1pxoverflow: hiddenbackground: #9BD1FA}
div.r1{margin: 0 5px}
div.r2{margin: 0 3px}
div.r3{margin: 0 2px}
div.rtop div.r4, div.rbottom div.r4{margin: 0 1pxheight: 2px}
</style>
<div id="nifty">
<div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
<p>Junstudio Blog</p>
<p>css实现圆角表格的效果</p>
<div class="rtop"><div class="r4"></div><div class="r3"></div><div class="r2"></div><div class="r1"></div></div>
</div>