提示：您可以先修改部分代碼再運行
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>css圓角矩形</title> <meta http-equiv="content-type" content="text/html; charset=gb2312" /> <meta http-equiv="Content-Language" content="zh-CN" /> <style type="text/css"> body{padding: 20px;background-color: #FFF;font: 14px,Verdana,Arial,sans-serif} h1,h2,p{margin: 0 10px} h1{font-size: 250%;color: #FFF} h2{font-size: 200%;color: #f0f0f0} p{padding-bottom:1em} h2{padding-top: 0.3em} div#nifty{ margin: 0 30px;background: #9BD1FA;} .text{ margin: 5px;background: #9BD1FA;padding-left: 20px} b.rtop, b.rbottom{display:block;background: #FFF} b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #9BD1FA} b.r1{margin: 0 5px} b.r2{margin: 0 3px} b.r3{margin: 0 2px} b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px} </style> </head> <body> <div id="nifty"> <b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b> <div class=text> <h1>csscss圓角矩形</h1> <br /> <p>測試</p> <h2>無圖片</h2> <br /> <p>無圖片實現圓角框</p> </div> <b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b> </div> </body> </html>
提示：您可以先修改部分代碼再運行
