版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
移动web-版心容器
设置最大宽度，最小宽度。通常为：max-width: 640px; min-width: 320px;
640和设计稿的大小有关系，为PSD图的大小。
640px宽度是早期标准，标准参考设备，iphone4
750px宽度是现在主流标准，参考标准设备为：iphone6
320保证网页内容的布局
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>Document</title>
<style type="text/css">
/*重置样式*/
*,
::before,
::after {
margin: 0;
padding: 0;
/* 针对移动端 */
box-sizing: border-box;
-webkit-box-sizing: border-box; /* 低版本主流浏览器兼容 */
-webkit-tap-highlight-color: transparent;/* 点击高亮效果清除 */
}
.container {
width: 100%;
height: 300px;
max-width: 620px;
min-width: 320px;
background-color: green;
margin: 0 auto;
}
</style>
</head>
<body>
<div class="container">我是中国人我是中国人</div>
</body>
</html>