1.嵌套元素中使用负边界
举例:
<div class="main">
<div class="content">子元素,注意自元素中的内容,这将有助于理解负边界的含义</div></div>
.main{
padding:50px 0 0 100px;
350px;
height:150px;
background:#999999;
}
.content{
margin:-100px 0 0 100px;
100px;
height:100px;
background:#cccccc;
}
实现效果是:子元素的上边界-100px,而父元素有50个像素的补白,故子元素将会向上移动50个像素.
但ie会隐藏子元素中的超出部分,而firefox则显示超出的部分.
2.使用overflow来固定长度和宽度
overflow:visible|hidden|auto|sroll;
visible:不剪切内容也不产生滚动条;
hidden:不显示超出的内容部分;
auto:在需要的时候产生滚动条;
sroll:总是显示滚动条;
3.控制高度属性 min-height,max-height
min-height:auto|长度值;
定义了元素的最小高度,当元素中的内容没有达到最小高度时,元素显示最小高度;当大于最小高度时,高度自适应。
注:IE浏览器不支持这两个属性值,它会理解为没有定义高度,也就是高度自适应auto.