<div id="wrapper" style="width:100%; background:#ccc; border-top: thick solid blue; border-bottom: thick solid blue; padding:10px;">
<div id="content">
This is some content.
</div>
</div>

http://jsfiddle.net/f7JT7/

我做了一切内联,所以更容易理解

我希望边框顶部和底部重复4种不同的颜色.

1 2 3 4 1 2 3 4 1 2 3 4

这可能与CSS？我知道我可以做点什么

<div>
<div id="red" style="width:50px;"></div><div id="green" style="margin-left:50px; width:50px;"></div><div id="purple" style="margin-left:100px; width:50px;"></div>
</div>

但我想看看有没有更好的方法用css做到这一点？谢谢.

这是我设计的屏幕截图