html-day08自适应

1.透明度

opacity:0~1的数字;
filter:alpha(opacity=0~100的数字);
0代表完全透明，opacity属性1或者filter的100代表完全不透明;

说明：这是让元素整体都透明
如果只是让颜色透明，用rgba(R,G,B,透明度);

2.自适应

概念：能够根据设备类型和尺寸、自动调整页面效果，以达到显示一个比较正常的布局效果。
1.宽度自适应
    1.不设置宽度
    2.使用百分比
    3.使用最大最小宽度
        min-width:*px; 设置最小宽度   【版心外面的盒子】
        max-width:*px; 设置最大宽度   【响应式】

2.高度自适应
    1.不设置高度。
        注意：如果子元素浮动，会脱离文档流，造成高度塌陷，所以需要清除浮动，解决这个问题。
            清除浮动 | 解除塌陷的方式：
                方式1：
                    1.给浮动元素的最后面添加一个空的div,并给他一个类名clear    <div class='clear'></div>
                    2.给该元素设置唯一的样式 .clear{clear:both; }
                
                方式2：
                    1.给浮动元素的父亲添加类名clearfix
                    2.设置样式
                        .clearfix:after{           //在该元素的内容后面添加一个伪元素
                            display:block;          //伪元素的类型是块级元素
                            content:'';             //元素的内容为空的
                            clear:both;             //清除前面兄弟的浮动
                            height:0;               //处理低版本兼容的
                        }
                        .clearfix{  zoom:1;  }     //IE6清除浮动的

                方式3：
                    1.给浮动元素的父亲添加样式  overflow:hidden;  【有作弊嫌疑】
    
    2.使用百分比
        注意：如果要实现一屏页面，需要先加
            html,body{
                width:100%;
                height:100%;
            }
    
    3.使用最大最小高度
        min-height:*px; 设置最小高度  【响应式】
        max-height:*px; 设置最大高度  【响应式】

3.伪元素

e:after{ content:'内容' }    在元素e的内容后面添加内容
e:before{ content:'内容' }   在元素e的内容前面添加内容

伪类和伪元素的区别： 【面试题】
    伪类是一种临时状态，只有状态触发的时候生效。伪元素是一个假的元素，虚拟的dom节点。
    伪类使用单冒号，伪元素使用双冒号。

    :after和::after都是伪元素，只是是不同版本写法。

::selection{  }       鼠标选中的文字样式设置
::placeholder{   }    提示信息的样式设置 

4.兼容最小高度的写法

min-height:*px;
height:auto !important;
_height:*px; 【IE5识别】