我们通常在写移动端页面时，往往都会在html页面中加入这样一段话
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
可能我们只知道这三个字段的含义（视口宽度等于设备宽度，屏幕缩放为1，禁止用户缩放），但是为什么要这么写，其原理又是什么呢？
我们先看一个简单的demo吧。
<!doctype html><html lang="en"><head><meta charset="UTF-8"><title>Test 02</title></head><style>
body{
margin: 0;
}
.pic{
width: 320px;
height: 568px;
background-color: #72DFFF;
color: white;
font-size: 60px;
text-align: center;
line-height: 568px;
font-family: cursive;
}</style><body>
<div class="pic"> 320*568 </div> </body></html>
网友评论
