Many smartphone browsers scale Web pages to a wide viewport width, one appropriate for displaying desktop-optimized markup. These browsers allow the user to zoom in and out of scaled Web pages. For example, Opera Mobile uses a default viewport width of 850 pixels, and the iPhone uses a default width of 980 pixels.
The Viewport META tag controls the logical dimensions and scaling of the browser viewport window in many smartphone browsers, including Safari Mobile for the iPhone, Android browser, webOS browser in Palm Pre and Pixi devices, Opera Mini, Opera Mobile and BlackBerry browsers. The presence of the Viewport META tag indicates that the markup document is optimized for mobile devices.
Here is a simplified version of the Viewport tag that sets the browser viewport width at 240 pixels and disables user scaling of the content:
程式项目名称
|
The content value of the Viewport META tag is a comma-delimited list of directives and
their values.
This example <meta> tag lists all Viewport directives and example values:
程式项目名称
|
This table lists the meanings and values of all supported directives of the Viewport META tag.
Viewport META directive | Example Value | Description |
width | width=320 width=device-width | Logical width of the viewport, in pixels. The specialdevice-widthvalue indicates that the viewport height should be the screen width of the device. |
height | height=480 height=device-height | Logical height of the viewport, in pixels. The specialdevice-heightvalue indicates that the viewport height should be the screen height of the device. |
user-scalable | user-scalable=no | Specifies whether the user can zoom in and out of the viewport, scaling the view of a Web page. Possible values areyes orno . |
initial-scale | initial-scale=2.0 | Sets the initial scaling or zoom factor (or multiplier) used for viewing a Web page. A value of 1.0 displays an unscaled Web document. |
maximum-scale | maximum-scale=2.5 | Sets the user’s maximum limit for scaling or zooming a Web page. Values are numeric and can range from 0.25 to 10.0. The value of this directives is a scaling factor or multiplier applied to the viewport contents. |
minimum-scale | minimum-scale=0.5 | Sets the user’s minimum limit for scaling or zooming a Web page. Values are numeric and can range from 0.25 to 10.0. The value of this directives is a scaling factor or multiplier applied to the viewport contents. |
- 关键字 : width, viewport, scale, height, scaling, Viewport, value, device, pixels, directives, values, scalable, minimum, maximum, initial, content, browsers, browser, multiplier, indicates