我們通常在寫移動端頁面時,往往都會在html頁面中加入這樣一段話
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
可能我們只知道這三個字段的含義(視口寬度等于設(shè)備寬度,屏幕縮放為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>
延伸閱讀
學(xué)習(xí)是年輕人改變自己的最好方式