标题 | css定义div圆角边框 |
范文 | <!doctype html public -//w3c//dtd xhtml 1.0 transitional//en> <html xmlns= lang=zh-cn> <head> <meta http-equiv=content-type content=text/html; charset=gb2312 /> <title>testdiv</title> <style> #d1,#d3,#d4{ margin:5px 0px; width:200px; background-color:#eee; } #d1{ border:1px solid #444; height:100px; padding:0px 15px; } #d3,#d4{ margin-top:0px; margin-bottom:0px; border-left:1px solid #444; border-right:1px solid #444; } .m{ height:100px; width:200px; padding:0px 15px; position:relative; } #d3 .m{ margin:-4px 0px; } #d4 .m{ margin:-5px 0px; } .rt,.rb{ display:block; width:232px; margin-left:0px; margin-right:0px; } .rt{ margin-top:5px; } .rb{ margin-bottom:5px; } .rt *,.rb *{ display:block; height: 1px; overflow: hidden; background-color:#eee; border-left:1px solid #444; border-right:1px solid #444; } .r1{ margin: 0 5px; background-color:#444; } .r2{ margin: 0 3px; border-width:0px 2px; } .r3{ margin: 0 2px; } .r4{ margin: 0 1px; height: 2px; } .rb1{ margin: 0 6px; background-color:#444; } .rb2{ margin: 0 4px; border-width:0px 2px; } .rb3{ margin: 0 3px; } .rb4{ margin: 0 2px; } .rb5{ margin: 0 1px; height: 2px; } </style> </head> <body> <div id=d1>r=...</div> <b class=rt><b class=r1></b><b class=r2></b><b class=r3></b><b class=r4></b></b> <div id=d3> <div class=m>r=5</div> </div> <b class=rb><b class=r4></b><b class=r3></b><b class=r2></b><b class=r1></b></b> <b class=rt><b class=rb1></b><b class=rb2></b><b class=rb3></b><b class=rb4></b><b class=rb5></b></b> <div id=d4> <div class=m>r=6</div> </div> <b class=rb><b class=rb5></b><b class=rb4></b><b class=rb3></b><b class=rb2></b><b class=rb1></b></b> </body> </html> |
随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。