模拟和测试其他浏览器

您的任务不只局限于确保网站在 Chrome 和 Android 上出色运行。即使 Device Mode 可以模拟 iPhone 等多种其他设备,我们仍鼓励您查看其他浏览器模拟解决方案。

  • 如果您没有特定设备,或者想要执行抽检,最佳方式就是直接在浏览器中模拟设备。
  • 利用设备模拟器,您可以从工作站在一系列设备上模拟开发网站。
  • 基于云的模拟器让您可以在不同平台之间对网站进行自动化单元测试。"

浏览器模拟器

浏览器模拟器非常适合于测试网站的自适应能力,但它们无法模拟 API 差异、CSS 支持,以及您可以在移动设备浏览器中看到的某些行为。在真实设备运行的浏览器上测试您的网站,确保一切均按照预期运行。

Firefox 的自适应设计视图

Firefox 拥有一个自适应设计视图,让您可以探索您的设计在常见屏幕尺寸上的变化或者通过拖动边缘的方式确定自己的大小,而不用考虑具体设备。

Edge 的 F12 模拟

要模拟 Windows Phones,请使用 Microsoft Edge 的内置模拟

由于 Edge 不具备旧版兼容性,请使用 IE 11 的模拟模拟您的页面在较旧版本 Internet Explorer 中的外观。

chrome开发工具指南(十四)的更多相关文章

  1. chrome开发工具指南(四)

    Sources 面板中 代码段是您可以从任何页面运行的小脚本(类似于小书签). 使用"Evaluate in Console"功能可以在控制台中运行部分代码段. 请注意,Sourc ...

  2. Chrome 开发工具指南

    Chrome 开发工具指南 谷歌 Chrome 开发工具,是基于谷歌浏览器内含的一套网页制作和调试工具.开发者工具允许网页开发者深入浏览器和网页应用程序的内部.该工具可以有效地追踪布局问题,设置 Ja ...

  3. chrome开发工具指南(一)

    注意:如果你是一个网页开发者同时想要获得最新版本的开发工具,那么你应该使用谷歌浏览器(金丝雀)Canary 版. Chrome 开发者工具 打开Chrome 开发者工具 选择浏览器位于浏览器窗口右上方 ...

  4. chrome开发工具指南(十二)

    使用 Device Mode 模拟移动设备 使用 Chrome DevTools 的 Device Mode 打造移动设备优先的完全自适应式网站.了解如何使用 Device Mode 模拟多种设备及其 ...

  5. chrome开发工具指南(十)

    检查和删除 Cookie 从 Application 面板检查和删除 Cookie. TL;DR 查看与 Cookie 有关的详细信息,例如名称.值.网域和大小,等等. 删除单个 Cookie.选定网 ...

  6. chrome开发工具指南(七)

    检查动画 使用 Chrome DevTools 动画检查器检查和修改动画. 通过打开动画检查器捕捉动画.检查器会自动检测动画并将它们分类为多个组. 通过慢速播放.重播或查看动画源代码来检查动画. 通过 ...

  7. chrome开发工具指南(二)

    Application 面板 使用 App Manifest 窗格检查您的网络应用清单和触发 Add to Homescreen 事件. 使用 Service Worker 窗格执行与服务工作线程相关 ...

  8. chrome开发工具指南(六)

    检查和编辑页面与样式 使用 Chrome DevTools 的 Elements 面板检查和实时编辑页面的 HTML 与 CSS. 在 Elements 面板中检查和实时编辑 DOM 树中的任何元素. ...

  9. chrome开发工具指南(十三)

    模拟传感器:地理定位与加速度计 由于大多数桌面设备都没有 GPS 芯片和加速度计,所以测试它们比较困难.Chrome DevTools 的 Sensors 模拟窗格可以通过模拟常见的移动设备传感器来降 ...

随机推荐

  1. CentOS 7 安装Subversion, 并用Nginx代理

    环境:CentOS 7.3.1611 分三步:第一步:安装subversion第二步:安装httpd第三步:安装nginx 操作步骤: 安装subversion, 命令 -> yum -y in ...

  2. 51. leetcode 530. Minimum Absolute Difference in BST

    530. Minimum Absolute Difference in BST Given a binary search tree with non-negative values, find th ...

  3. Eclipse中tomcat配置

    配置这两个东西 tomcat,在eclipse中启动 tomcat 才会可以访问   来自为知笔记(Wiz)

  4. jmeter - 断言

    jmeter中有个元件叫做断言(Assertion),它的作用和loadrunner中的检查点类似: 用于检查测试中得到的响应数据等是否符合预期,用以保证性能测试过程中的数据交互与预期一致. 使用断言 ...

  5. Linux用户深度管理

      linux系统是多任务.多用户的系统. 用户.用户组的概念 每个文件和进程,都需要对应一个用户和用户组. linux系统是通过UID和GID来是识别用户和组的. 其中用户名等同于人名(人类识别), ...

  6. Docker 搭建开发环境

    本文介绍如何将Docker集成到开发环境,自动构建应用,并使容器拥有独立的内网IP为开发人员提供服务. 术语解释 Docker镜像:一个不可修改的"模板",每个代码版本对应一个镜像 ...

  7. 优秀开源软件学习系列(一)——从零学习Spring4以及学习方法分享

    一.目的1.掌握Spring4怎样使用,以便将这个框架作为自己的一项技能.2.掌握Spring官网是怎样介绍其产品的,在心中对Spring有最官方的.最直观的了解.在Spring的相关领域,能够知道怎 ...

  8. 【Maven】解决linux下安装maven update-alternative --display mvn链接层数过多

    问题描述: 今天首次在linux上安装配置maven,编辑/etc/profile 配置好环境变量之后 使用mvn -v 显示出mvn配置信息,此时以为可以顺利的构建maven项目. 结果中间构建时, ...

  9. 《HelloGitHub》第 17 期

    公告 本月 hellogitub.com 动态 服务器迁移到了国内,国内浏览速度有了质的飞跃. 代码重构 项目 运行更加简单,直接 clone.执行安装依赖命令.运行 上线了"我的收藏&qu ...

  10. Django编写RESTful API(四):认证和权限

    欢迎访问我的个人网站:www.comingnext.cn 前言: 按照前面几篇文章里那样做,使用Django编写RESTful API的基本功能已经像模像样了.我们可以通过不同的URL访问到不同的资源 ...