不用javascript自然最好,如果js更方便的话也请一并告之吧有实例有代码,请看:HTML<div class="header">header</div>
<div class="col1">col1</div>
<div class="col2">col2</div>
<div class="col3">col3</div>CSS.header { width: 100%; background: #567; height: 100px;
}.col1, .col2, .col3 { float: left; width: 80px; background: #DDD; height: 100%; margin-right: 10px;
}如果有footer的情况下 假如footer也要占位100px,一直位于下方,那中间这三列又该怎么弄呢?
2 回答
动漫人物
TA贡献1815条经验 获得超10个赞
padding-bottom大数值margin-bottom负大数值
.col1, .col2, .col3 {
float: left;
width: 80px;
background: #DDD;
height: 100%;
margin-right: 10px;
padding-bottom:5000px;
margin-bottom:-5000px;
}
杨__羊羊
TA贡献1943条经验 获得超7个赞
试试这个, 不知满足楼主要求否?
<!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>test</title> <style type="text/css"> .header { width: 100%; background: #567; height: 100px; } .col1, .col2, .col3 { float: left; width: 80px; background: #DDD; height: 100%; margin-right: 10px; word-wrap:break-word; overflow:hidden; padding-bottom:100%; margin-bottom:-98%; font-size:12px; } .foot{height:100px; background-color:#ccc;} .middle{overflow:hidden; zoom:1;} </style></head><body><div class="header">header</div><div class="middle"> <div class="col1">111colsdfffffffffffffffffffffffffffffcolsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1fffffff1222</div> <div class="col2">col2</div> <div class="col3">333colsdfffffffffffffffffffffffffffffcolsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1fffffff1colsdfffffffffffffffffffffffffffffcolsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1colsdffffffffffffffffffffffffffffffffffff1fffffff1444</div></div><div class="foot">foot</div></body></html>
- 2 回答
- 0 关注
- 213 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消