現在使用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 -->
以上是使用css3製作圓角實例程式碼的詳細內容。更多資訊請關注PHP中文網其他相關文章!