robertbao's website

版权声明：本文可以任意转载，转载时请务必以超链接形式标明文章原始出处和作者署名及本版权声明。

1、圆角矩形的代码段，方法用的比较巧妙，就是用5张不同的图片作背景来表示出这种效果。

2、css代码：

/* 后四张图片四分之一圆内部用第一张图片的颜色，外部用包含这个矩形的背景颜色 */
.rbroundbox { background: url(nt.gif) repeat; }/* 矩形内容背景图片*/
.rbtop div { background: url(tl.gif) no-repeat top left; }/* 左上角图片 */
.rbtop { background: url(tr.gif) no-repeat top right; }/* 右上角图片 */
.rbbot div { background: url(bl.gif) no-repeat bottom left; }/* 左下角图片 */
.rbbot { background: url(br.gif) no-repeat bottom right; }/* 右下角图片*/

.rbtop div, .rbtop, .rbbot div, .rbbot {
width: 100%;
height: 7px;
font-size: 1px;
}
.rbcontent { margin: 0 7px; }
.rbroundbox { width: 50%; margin: 1em auto; }

3、html代码：

<div class="rbroundbox">
<div class="rbtop"><div></div></div>
<div class="rbcontent">
<p>马英九表示，他对当局护渔的一贯态度，就是当局表现不佳，让日本欺负我们渔民，太不象话，他曾经多次表达强烈反对。他说，在野党只能呼吁，我们的态度应该是“扩大护渔、不惜一战、以战逼和”，让日本愿意上谈判桌，划出渔区做出承诺，要真的拿出办法才行，否则相同的情况会一再重演。</p>
</div><!– /rbcontent –>
<div class="rbbot"><div></div></div>
</div><!– /rbroundbox –>

4、本站css暂未加入这个，所以暂时还看不到效果。