在ie6下,当元素设置了height值和line-height值时,元素的实际高度按两者中大的那个来定的。而在其他浏览器中元素的高度只与height值有关,line-height的值只会影响元素中内容如文字在元素中的位置。
示例代码如下:
<style>
div{
height:30px;
line-height:40px;
width:40px;
border:1px solid blue;
}
</style>
<div>
1111
</div>
显示效果如下:
在ie6下,div的高度是40px,内部文字111在div元素中垂直居中,如图左;
而在其他浏览器中div的高度是30px,内部文字因为line-height的设置,使它在div元素中的位置垂直偏下,如图右。