PC端的宽高自适应
宽度自适应（了解）：元素的宽默认是跟随父元素的， 尽量不要规定死；不写默认是100%的父元素的宽度；
后续：宽度100%，根据窗口的宽度不同，作出不同结构变换的响应式网页；
高度自适应；
高度自适应第一种情况：内容撑开父元素
主要针对内容块；（考虑一些版块后期会不会经常性修改）
需求一：当元素的height不去设置或者是设置成auto是（默认），那么height是被内容撑开的；
需求二、当内容特别少的情况下，让容器有一个最小高度；------>min-height:
拓展：(IE低版本不支持min-height)但是IE6默认的把height解析成最小高度；
如果想让高版本和IE6里面效果完全一致（一般开发不考虑IE6用户，但是这里体会一下处理兼容性问题的思路）
如果同时使用min-height 和 height，高版本浏览器执行结果是height的固定高度
方法1、使用过滤器：min-height:300px; _height:300px（下划线过滤器，只有IE6能识别带有下划线的属性）
方法2、使用!importan ----> min-height:300px; height:auto!important; height:300px;
高版本浏览器会执行min-height:300px;同时，height:auto;的权重高优先执行，满足了效果；
IE6不识别min-height,同时也不认识!important ，不会认为height:auto;权重高，则会执行height:300px;同时将height当做最小高度执行，满足内容撑开高度，且有最小高度的需求
那么需要考虑：如果高度自适应的版块内的子元素添加了浮动，会有怎样的影响？怎么处理？
父元素添加min-height，子元素添加了浮动，子元素无法撑开父元素的高度，依旧是最小高度；
但如果不给父元素设置高度，会出现高度塌陷！如果想满足子元素即有浮动而且父元素还能实现高度自适应的需求。就需要解决高度塌陷问题；
解决高度塌陷：
方法1、给出现高度塌陷的元素添加overflow：hidden----->触发BFC（一种布局逻辑）
BFC规定：计算BFC高度的时候，浮动元素也会参与计算。
弊端：会隐藏掉定位在元素外围的内容；
方法2、增加一个带有clear:both;且高为0的盒子
clear:both;浮动的清除，给最下面的0高度的元素添加闭合浮动，就不会因为上面浮动的元素不占据空间而上去； 可以理解把这个元素钉在这，不因上面高度塌陷上去占据空间；满足了高度自适应的同时还能给子元素添加浮动的情况；
弊端：代码冗余，代码内会出现很多空元素，对浏览器不友好；
方法3、万能清除法； 所有情况全考虑，需要时，加上类名就行；
伪类： .clear_fix:after {
contene:".";
clear:both;
display:block;
height:0;
overflow:hidden;
visibility:hidden;------------------>display:none;是彻底隐藏，不再占据空间，而visibility:hidden；是隐藏 元素但是依旧占据空间；
}
如果IE浏览器出现高度塌陷问题：
直接-------> .clear_fix{ zoom:1;} 属于IE浏览器兼容性问题专用
最终效果就是：实现了即使用了浮动让子元素横向排列，又利用万能方法解决了子元素浮动父元素高度自适应带来的高度塌陷问题；
高度自适应的第二种情况：让子元素高度随着父元素高度进行改变。
百分比需求：案例---->将一个元素在整个窗口完全平铺---->需要将body和html的高度设置成100%
html,bdy{height:100%;}
再进行子元素的宽高设置；
