Front-end mobile development--viewpoint

When mobile development, it is common to load such a row of meta tags in the head

<meta name= "viewport" content= "Width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" >

What does this line mean?

Viewport is the screen of the device can be used to display the area of our page, the default viewport is the layout viewport, that is, the screen is wider than the viewport, but in the development of mobile device website, we need ideal Viewport Width=device-width indicates that the current viewpoint is equal to the width of the device, width is used to set the layout viewport, and height is used to set layout viewport. initial-scale=1.0 indicates that the initial scaling value of the page is 1,maximum-scale allows the user's maximum zoom value, Minimum-scale allows the user's minimum zoom value, user-scalable Indicates whether the user is allowed to scale, "No" is not allowed, "Yes" allows.

About zooming

Scaling refers to the relative ideal viewport, such as <meta name= "viewport" content= "width=500, initial-scale=1" >,width= 500 means that the current viewport width is set to 500,initial-scale=1 the width of the current viewport is set to the width of the ideal viewport, the browser should do, the general will take the larger value.

Front-end mobile development--viewpoint