【Android开发API】web应用web应用的屏幕适配TargetingScreensfromWebApps.pdfVIP

eoe 移动开发者社区 译：CuGBabyBeaR 完成时间：8月15 日 原文链接：/guide/webapps/targeting.html 如果您正在为Android或者移动设备开发或者重新设计⼀个web应用， # 快速预览 * 您可以通过viewport 您应该仔细研究您的网页是如何在不同种类的屏幕上显示的。因为 metadata ，CSS ，和JavaScript为不同的屏幕 Android是可以存在于使用不同类型屏幕的设备上的，您应该考虑⼀些 匹配您的web页面 。 * 本文所述的技术在 影响您的网页在Android设备上显示方式的因素 。 Android 2.0或更 版本下，且显示在默认 Android浏览器和WebView 中的网页上⼯作 。 # * 注：* 这个本文档中描述的方法，在Android2.0或更 版本下，被 在此篇文档中 Targeting Screens from Web Android浏览器( 由缺省Android平台所提供的)和WebView(用来显示 Apps#使用Viewport Metadata 使用Viewport 网页的框架视图部件 （widget）)所支持 。 运行在Android上的第三 Metadata :Targeting Screens from Web 方浏览器可能不支持用这些方法来控制viewport 的尺⼨和屏幕的密 Apps#预定义viewport尺⼨ 预定义viewport尺⼨ 度 。 :Targeting Screens from Web Apps#预定义 viewport缩放 预定义viewport缩放 :Targeting 当您为Android设备指定您的网页时,有两个您应该注意的基本因素: Screens from Web Apps#预定义viewport 匹配 viewport 的尺⼨和网页的缩放 密度 预定义viewport 匹配密度 Targeting :当Android浏览器加载⼀个网页时,默认行为是以概览模式加载这个页 Screens from Web Apps#用CSS适配设备密度 面，概览模式是指提供缩⼩至这个页面的远景的视图。您可以通过定 用CSS适配设备密度 Targeting Screens from 义这个viewport 的默认尺⼨或者初始缩放值，为您的网页重写这个行 Web Apps#用JavaScript适配设备密度 用 为 。如果可用的话，您同样可以控制用户能够将您的网页放⼤或者缩⼩ JavaScript适配设备密度 多少 。用户同样可以在浏览器的设置里关闭概览模式，所以您绝对不应 该假设您的页面会在概览模式下加载 。您应该为您的页面设置合适的自定义viewport 的尺⼨和/或网页的缩放 。 :但是，当您的页面在WebView 中显示时，页面会在无缩放 （而不是“概览模式”）下加载 。这就是说，会以页面的默认⼤⼩ 显示它，而不缩⼩它 。 （这也是当用户关闭了概览模式时，页面d 的显示方式 。） 设备的屏幕密度 :Android设备的屏幕密度 （每英⼨像素数）影响着显示哪个网页及其显示尺⼨的决定 。 （有三个屏幕密度类别：低 、