CSS圓角區(qū)塊容器生成器

更新時間：2006年07月25日 00:00:00 作者：

當然還是用圖片，只是可以生成自己所需色彩的圖片。

http://www.neuroticweb.com/recursos/css-rounded-box/

將上面生成的圖片和下面代碼存在同一個文件夾下：

</P>
<P><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head><title>CSS圓角區(qū)塊容器</title><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><style>.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; }</P>
<P>/* height and width stuff, width not really nessisary. */.rbtop div, .rbtop, .rbbot div, .rbbot {width: 100%;height: 7px;font-size: 1px;}.rbcontent { margin: 0 7px; }.rbroundbox { width: 50%; margin: 1em auto; }</style></head></P>
<P><body><div   id="wppm3vysvbp"   class="rbroundbox"> <div   id="wppm3vysvbp"   class="rbtop"><div></div></div>  <div   id="wppm3vysvbp"   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>  </div> <div   id="wppm3vysvbp"   class="rbbot"><div></div></div></div></body></html></P>
<P>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁面才能執(zhí)行]

您可能感興趣的文章: