IE 元素默认高度研究
| 序号 |
HTML |
IE<=7 CSS样式 |
表现: |
实际高度 (px) |
说明 |
| 1 |
<div></div> |
|
|
0 |
啥事没有 |
| 2 |
<div></div> |
width:100px;
|
|
15 |
触发haslayout |
| 3 |
<div></div> |
height:1px;
|
|
0 |
|
| 4 |
<div></div> |
overflow:hidden;
|
|
15 |
触发haslayout |
| |
| 5 |
<div></div> |
width:100px; height:0px;
|
|
0 |
|
| 6 |
<div></div> |
width:100px; line-height:0px
|
|
15 |
|
| 7 |
<div></div> |
width:100px; font-size:0;
|
|
2 |
|
| 8 |
<div></div> |
width:100px; height:0px; line-height:0px;
|
|
0 |
|
| 9 |
<div></div> |
width:100px; height:0px; font-size:0;
|
|
0 |
|
| 10 |
<div></div> |
width:100px; height:0px; overflow:hidden;
|
|
0 |
成功 |
| 11 |
<div></div> |
width:100px; line-height:0px; overflow:hidden
|
|
15 |
|
| 12 |
<div></div> |
width:100px; font-size:0px; overflow:hidden
|
|
2 |
|
总结：
- 如果你需要从0开始自适应高度，那么不要定义width/height/overflow
- 如果你要定义小于15像素的高度，加上 overflow:hidden; 就可以了
演示地址: http://demo.phpstudy.net/html/IE-default-height.html
«
»