优秀程序员web前端分享高度自适应1.宽高自适应在web布局中，元素的宽高往往是定义好的。但是很多时候我们希望元素的大小能够根据窗口或者子元素自动调整，这就是自适应。它可以使网页显示更加灵活，能够适应不同设备、不同窗口、不同分辨率下的显示。(1)自适应宽度块元素的宽度默认为auto(2)自适应高度元素{height:auto;}/height不写2.浮动元素的父元素的高度是自适应的（当高度为父元素不写，子元素写了浮动后，父元素高度会塌陷）解决高度塌陷的方法（清除浮动的方法）：方法一：在声明中加入overflow:hidden父元素；（缺点：会隐藏溢出的元素）hack2：在浮动元素下方添加空块元素，并在元素中添加声明：clearboth;height:0;overflow:hidden;（缺点：结构中加入空标签，不利于代码可读性，降低浏览器性能）：0；可见性：隐藏；}父容器选择器{zoom:1;}/为了兼容IE6,IE7/三,伪类选择器/::伪元素或伪对象1):after(与content属性一起使用定义后面的内容object.)例如：div:after{content:url(logo.jpg);}div:after{content:"textcontent";}2):before:与content属性一起使用，定义object之前的内容.如：div:before{content:"把内容放在前面";}3):first-letter:定义对象中第一个字符的样式。4):first-line：定义对象中第一行的样式。说明：*(:first-letter;:first-line这个伪类只能用于块级元素。)四、visibility的区别：hidden/visible/inherit;隐藏/可见visibility:hidden;和显示：无；：可见性：隐藏；属性会让对象不可见，但是对象在网页上所占的空间并没有改变，而display:none属性会隐藏内容，空间会消失。元素有最小高度最小宽度、最大高度、最大宽度自适应min-height属性：最小高度；min-width：最小宽度max-height：最大高度max-width：最大宽度注：IE6及以下版本不识别该组属性。注意：height属性类似于IE6中的min-height。5、Filter：表示filter的意思，是针对特定的浏览器或浏览器组显示或隐藏规则或语句的方法。从本质上讲，Filter是一种用于过滤不同浏览器的Hack。-----、filter(过滤器)1)underlineattributefilter当属性前面加下划线时，这条语句会被忽略，因为符合标准的浏览器无法识别带下划线的属性，但在IE6及更低版本的浏览器中会继续解析这条规则。语法：selector{_attribute:属性值;}2)!importantkeywordfilter表示附加语句的优先级最高。但是由于IE6及以下版本无法识别（重要），我们可以利用IE6的这个bug作为过滤器来兼容IE6等标准浏览器。语法：选择器{attribute:attributevalue!important;}兼容元素有一个最小高度自适应方法：hack1:min-height:value;_height:value;hack2:min-height:value;高度：自动！重要；高度：值；(推荐)3)*/+属性过滤当在属性前加*时，该属性只能被IE7及以下版本的浏览器识别，其他浏览器忽略该属性的作用。语法：selector{*attribute:属性值;}4）扩展内容9：IE9以下语法：selector{attribute：属性值9;}0：IE8及以上语法：selector{attribute：属性值0;}6.元素高度自适应窗口高度设置方法：html,body{height:100%;}2）自适应元素高度：height:100%;extension:7.frameborder="1/0"1代表frameborder/0代表无frameborder滚动条：scrolling="yes/no/auto"yes:yesno:noauto:自动表示超链接的目标地址在框架中打开。
