網頁自適應PC端和移動端
阿新 • • 發佈：2020-12-14
如何讓網頁自動適應PC端和移動端
只需增加這麼一行：<meta name="viewport" content="width=device-width, initial-scale=1.0">
- viewport是view portion的意思，用漢語說，就是“可見區域“。所以這個標籤是在定義可見區域的規則。
- width=device-width的意思是”寬度自動適配裝置螢幕寬度"
- inital-scale=1.0的意思是“初始寬度為螢幕寬度的1倍”，實際上就是裝置寬度。
The viewport is the user's visible area of a web page. It varies with the device - it will be smaller on a mobile phone than on a computer screen.
You should include the following <meta> element in all your web pages:
This gives the browser instructions on how to control the page's dimensions and scaling.
The width=device-width part sets the width of the page to follow the screen-width of the device (which will vary depending on the device).
The initial-scale=1.0 part sets the initial zoom level when the page is first loaded by the browser.