|
|
div css自动调整高度问题 | |
| 阅读 100 次 更新时间：2008/8/6 | |
|
<!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=gb2312" /> <title>div自动高度</title> <style type="text/css"> <!-- .line{ border: 1px dashed #333;} .con {margin:auto; background-color:#FFFFCC;} .top{ height:200px; width:80%; background-color:#eee; margin:0 auto 10px auto;} .cl{ clear:both;} .con1 { overflow:auto; height:auto;margin:auto; background-color:#FFFFCC;} .top1{ height:200px; width:80%; background-color:#eee; margin:0 auto;} --> </style> </head> <body> <h4>利用clear自动高度，因为TOP层有下边界</h4> <div class="con line"> <div class="top line"></div> <div class="top line"></div> <div class="top line"></div> <div class="top line"></div> <div class="top line"></div> <div class="top line"></div> <div class="cl"></div> </div> <h4>利用overflow和高度的自动高度实现，无下边界的情况</h4> <div class="con1 line"> <div class="top1 line"></div> <div class="top1 line"></div> <div class="top1 line"></div> <div class="top1 line"></div> <div class="top1 line"></div> <div class="top1 line"></div> </div> </body> </html> | |
|
|
|