网页:适应IE和Firefox的Div最小高度设置
|
日期:2007年7月6日 作者: 查看:[大字体
中字体 小字体]
|
在IE环境下,其实height就几乎就等于是min-height,指定容器高度后,当内容撑大时有自动延伸的特质。在Firefox内不会,而是显示固定height值。所以,就要找到一种适应IE和Firefox的方法。 下面的四个Box中只有Box4是在IE和Firefox下都适应。
<html> <head> <style type="text/css"> <!-- .box1{ background-color:#F90; min-height:200px; width:125px; height:200px; float:left;} .box2{ background-color:#0CF; min-height:200px; width:125px; height:200px; float:left;} .box3{ background-color:#9C0; min-height:200px; width:125px; height:200px; float:left; height:auto;} .box4{ background-color:#F9C; min-height:200px; width:125px; height:200px; float:left;} [class].box4{height:auto;} --> </style></head>
<body> <div class="box1"> <p>BOX1</p> <p>BOX1</p> <p>BOX1</p> <p>BOX1</p> <p>BOX1</p> <p>BOX1</p> <p>BOX1</p> <p>BOX1</p> <p>BOX1</p> <p>BOX1</p> </div> <div class="box2"> <p>BOX2</p> </div> <div class="box3"> <p>BOX3</p> </div> <div class="box4"> <p>BOX4</p> <p>BOX4</p> <p>BOX4</p> <p>BOX4</p> <p>BOX4</p> <p>BOX4</p> <p>BOX4</p> <p>BOX4</p> <p>BOX4</p> <p>BOX4</p> </div> </body> </html>
下面时在两种浏览器中的截图。
(出处:清风网络学院)
上一篇:网页制作:实现CSS网页布局的简单原理
下一篇:网页制作技巧:CSS 实现完美垂直居中
|
| 网页:适应IE和Firefox的Div最小高度设置 相关文章: |
|
|
|
| 网页:适应IE和Firefox的Div最小高度设置 相关软件: |
|
|
|