双屏 Web 体验

由 Chromium 提供支持的 Microsoft Edge 为跨设备的网站和 Web 应用体验提供强大且兼容的基础。 这包括在 Surface Duo 上运行时的新双屏支持。

• 双屏布局的新 Web 标准：可以使用双屏布局的 CSS 基元或 JavaScript 视区段 API，来检测多个显示器并在这些显示器之间进行 web 内容布局。

• 在 Surface Duo 或仿真器上进行测试：在新 web 标准预览期间，请按照这些说明在 Surface Duo 或仿真器上启用双屏支持。

• 在桌面设备上生成和测试：还可以通过 Microsoft Edge 或 Chrome 在桌面设备上生成和测试双屏 web 体验。 按照以下说明启用双屏开发人员工具。

• 渐进式 Web 应用：新版 Microsoft Edge 直接支持 PWA，后者可以直接在 Android 设备上的浏览器中安装。 PWA 支持与浏览器相同的双屏布局功能和工具。

其他资源

• Microsoft Edge 博客
• Surface Duo 开发人员博客

Introduction to dual-screen devices（双屏设备简介）中概述了使用现有功能和技术使应用更适合在双屏设备上运行的多种方法。 可以通过此现有文档详细了解如何在 Web 应用中实现这些功能。

功能	有关详细信息，请参阅...
响应式应用布局	The building blocks of responsive design（响应式设计的构建基块）(Mozilla)
支持各种输入	PointerEvent (Mozilla)
拖放	HTML 拖放 API (Mozilla)
媒体画中画	Picture-in-Picture（画中画）(W3C) Picture-in-picture sample（画中画示例）(Chrome)