用户指南 取消(C)

预览 Dreamweaver 网页

 

 

将设备连接到 Dreamweaver 桌面应用程序即可在各种设备上预览、检查、测试和调试网页。

从 2021 年 11 月 16 日起,所有 Dreamweaver 版本上均已停用跨越多个设备预览页面的功能。我们提倡您探索在多个浏览器上预览页面的实时预览功能。

Dreamweaver 现在可让您在多个设备上同时测试即将发布的正式版网页。您可以查看网页如何在各种外形规格下进行回流,还可以在您的页面上测试交互功能。无需安装任何移动应用程序或将设备物理连接到您的桌面,即可实现所有这些功能!只需使用您的设备扫描自动生成的 QR 代码,并在设备上预览网页。

实时检查在桌面上触发时将反映在所有连接的设备上,并有助于检查各种元素和按需微调设计。

先决条件

确保设备上装有二维码扫描器。

确保桌面和移动设备连接到 Internet 并在同一网络上。

请确保您已准备好 Adobe ID 凭据。在预览时,您需要利用您桌面上 Dreamweaver 所用的 Adobe ID 登录设备。

如果您是企业客户,请检查您是否具有访问设备预览服务所需的权限。

确保在设备上的浏览器设置中启用了 JavaScript 和 Cookie。

支持的设备

所有 Android 和 iOS 设备

在设备上预览网页

  1. 在台式计算机上启动 Dreamweaver,然后打开要在设备上预览的网页。

  2. 单击文档工具栏中的“实时预览”图标。

    在设备上实时预览
    在设备上实时预览

    随后将显示“设备预览”弹出窗口,其中具有二维码和短 URL。

     

  3. 用要在其上预览 Web 文档的移动设备扫描该二维码。要连接多个设备,请使用其中每台设备扫描该二维码。

  4. 设备上将出现一个登录屏幕。使用您的 Adobe ID 凭据登录。确保使用的 Adobe ID 就是用于 Dreamweaver/Creative Cloud 的同一个。

    设备上的登录屏幕

  5. 成功登录后,所连接的设备的名称即出现在“设备预览”弹出窗口中。并且,您将在所连接的设备上看到您网页的预览。

    显示已连接设备的“设备预览”弹出窗口

注意:

要将该弹出窗口中的设备名称映射到实际设备,请将鼠标悬停在设备名称上。随后将在相应设备上出现反馈屏幕。

在设备上检查网页

要在所有连接的设备上检查网页,请单击 Dreamweaver 工具栏中的“检查”图标。

工具栏上的“检查”选项
工具栏上的“检查”选项

在特定设备上检查网页,请在“设备预览”弹出窗口中单击与设备名称对应的“检查”图标。Dreamweaver 中的视口被设置为与相应设备上的视口相同,并在特定设备和 Dreamweaver 上触发检查。

再次单击 Dreamweaver 中的“检查”图标以退出“检查”模式。

提交在桌面上对网页作出的编辑后,所有编辑均立即反映在设备上。

设备预览故障排除

如果在连接设备或在设备上预览网页时遇到问题,请参阅文章设备预览 - 故障排除中的信息。

更快、更轻松地获得帮助

新用户?