div+css无图片实现不带背景圆角框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无图片实现圆角框</title><style type="text/css">body{padding:50px;}.container{margin:0px auto;width:600px;border:0px solid #F00;padding:10px;}/*利用背景颜色和边框色实现圆角框*/.divbox{ width:500px;}/*控制圆角框的宽度*//*上下边框线及圆角效果*/.div1{ background:#999; border-left:#999 solid 1px; border-right:solid 1px #999; margin:0px 2px; height:1px; overflow:hidden;}.div2{background:#FFF; border-left:#999 solid 1px; border-right:solid 1px #999; margin:0px 1px; height:1px; overflow:hidden;}/*控制圆角区的高度和内容的左右边框线*/.divmiddle{ height:400px;border-left:#999 solid 1px; border-right:solid 1px #999;}</style></head><body><div class="container"> <div class="divbox"> <div class="div1"></div> <div class="div2"></div> <div class="divmiddle">内容</div> <div class="div2"></div> <div class="div1"></div> </div></div></body></html>