css3を使用して角の丸いサンプルコードを作成する

最近ではcss3を使って角を丸くするものが増えています

/* set millions of background images */
.rbroundbox { background: url(nt.gif) repeat; }
.rbtop p { background: url(tl.gif) no-repeat top left; }
.rbtop { background: url(tr.gif) no-repeat top right; }
.rbbot p { background: url(bl.gif) no-repeat bottom left; }
.rbbot { background: url(br.gif) no-repeat bottom right; }
/* height and width stuff, width not really nessisary. */
.rbtop p, .rbtop, .rbbot p, .rbbot {
width: 100%;
height: 7px;
font-size: 1px;
}
.rbcontent { margin: 0 7px; }
.rbroundbox { width: 50%; margin: 1em auto; }

2 [Code]

<p class="rbroundbox">
<p class="rbtop"><p></p></p>
<p class="rbcontent">
<p>Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Duis
ornare ultricies libero. Donec
fringilla, eros at dapibus fermentum,
tellus tellus auctor erat, vitae porta
magna libero sed libero. Mauris sed leo.
Aliquam aliquam. Maecenas vestibulum.</p>
</p><!-- /rbcontent -->
<p class="rbbot"><p></p></p>
</p><!-- /rbroundbox -->

。

以上がcss3を使用して角の丸いサンプルコードを作成するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。