HTML-<meta name= "viewport" content= "XX"/> Tags common Properties and descriptions

<meta name= "viewport" content= "Width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, User-scalable=yes "/>

Add these words to the

which

Width=device-width: Indicates width is the width of the device screen

Height=device-height: Indicates width is the width of the device screen

Initial-scale=1.0: Represents the initial scaling scale (1 times times the initial size, i.e. the original)

minimum-scale=0.5: Represents the minimum zoom ratio

Maximum-scale=2.0: Represents the maximum zoom ratio

User-scalable=yes or 1: Indicates whether the user can adjust the zoom ratio (no or 0: indicates non-adjustable scaling)

TARGET-DENSITYDPI:

A screen pixel density is determined by the screen resolution, usually defined as the number of dots per inch (dpi). Android supports three screen pixel densities: low pixel density, medium pixel density, high pixel density. A low-pixel-density screen has fewer pixels per inch, while a high-pixel-density screen has more pixels per inch. The default screen for Android browser and webview is medium pixel density.

The following is the range of values for the Target-densitydpi property

• The device-dpi– uses the original DPI of the device as the target DP. No default scaling occurs.

• high-dpi– uses hdpi as the target dpi. Medium pixel density and low pixel density devices are scaled down accordingly.

• medium-dpi– uses MDPI as the target dpi. High pixel density devices are scaled accordingly, and pixel density devices are scaled down accordingly. This is the default target density.

• LOW-DPI-use MDPI as the target dpi. Medium pixel density and high pixel density devices are scaled accordingly.

• <value>– specifies a specific DPI value as the target dpi. The range of this value must be between 70–400.

To prevent Android browser and WebView from scaling your page based on the pixel density of different screens, you can set the target-densitydpi of viewport to device-dpi. When you do this, the page will not scale. Instead, the page is displayed based on the pixel density of the current screen. In this case, you also need to define the width of the viewport to match the width of the device so that your page will fit on the screen.

If you want to open a webpage, it is automatically displayed at the original scale, and the user is not allowed to modify it:

<meta name= "viewport" content= "Width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, User-scalable=no "/>

This article is from the "beautiful Dē‖java Question" blog, please be sure to keep this source http://teny32.blog.51cto.com/8027509/1832979

HTML-<meta name= "viewport" content= "XX"/> Tags common Properties and descriptions