Rumah >hujung hadapan web >tutorial css >使用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; }
<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 -->
Atas ialah kandungan terperinci 使用css3制作圆角实例代码. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!