媒体查询@media

1. @media的兼容性

　　需要 chrome21 ，ie9 ，FireFox3.5 ，Safari 4.0

2.写法

　　　　　　　//小于500像素时

            @media screen and (max-500px){
                .header{color:#ccc;}
            }
            
            //大于600像素小于1000像素时

            @media screen and (min-600px) and (max-1000px){
                .header{color:#eee;}
            }

            //大于1100像素时

            @media screen and (min-1000px){
                .header{color:#333;}
            }
ip5: min-320px; （320*568）
ip6： min-375px; （375*667）
6plus: min-414px; （414*736）
ipad :  min-768px;
小米4s:  (360*565)