宽高自适应
我们在网页布局中经常要定义元素的宽高。但是我们如果定义宽高是一个定数时,当在不同的分辨率的电脑上打开的时候,往往会出现与屏幕不适应的情况,所以我们希望元素大小能根据窗口或子元素自动调整,这就是自适应。
元素自适应在网页布局中非常重要,它能够使网页显示更灵活,可以适应在不同设备、不同窗口和不同分辨率下显示。
1. 宽度自适应
元素宽度设置为100% (块元素宽度默认为100%)
2. 元素具备最小高度的自适应
min-height属性:最小高度: (IE6浏览器不识别该属性)
hack1:min-height:value;_height:value;
hack2:min-height:value; height:auto!important; height:value;(建议使用)
注: height属性在IE6里就类似min-height作用。
Min-height (最小高度)
Max-height(最大高度)
Min-width (最小宽度)
Max-width (最大宽度)
3.元素高度自适应窗口高度
设置方法:html,body{height:100%}
自适应元素高度:height:100%;