响应式布局

标签：

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

1.width=device-width　　//应用程序的宽度和屏幕的宽度是一样的

2.height=device-height　　//应用程序的高度和屏幕的高是一样的

3.initial-scale=1.0　　//应用程序启动时候的缩放尺度（1.0表示不缩放）

4.minimum-scale=1.0　　//用户可以缩放到的最小尺度（1.0表示不缩放）

5.maximum-scale=1.0　　//用户可以放大到的最大尺度（1.0表示不缩放）

6.user-scalable=no　　//用户是否可以通过他的手势来缩放整个应用程序，使应用程序的尺度发生一个改变（yes/no）

@media (min-width:768px) and (max-width:1024px) {
    div{
    background-color:red;
    }
}
@media (max-width:768px) {
    div{
    background-color:black;
    }
}

响应式布局

标签：

原文地址：http://www.cnblogs.com/zhuanggege/p/5817401.html