• 前端分享学习博客,探究前端相关技术,推动天朝前端发展,有任何问题都可以留言一起探究
  • 由于站内自链接问题,部分pre中的代码首字母使用大写以过滤筛选
  • 欢迎友链互换,还有,如果有大神请不要黑我的站点(o´・ェ・`o)
  • 如果你觉得博客还不错,请Ctrl+D收藏( *︾▽︾)

微软官方网站线上兼容测试平台-Browser screenshots

Html/Css 薛 陈磊 732次浏览 未收录 0个评论 扫描二维码

前端开发时最不想做的就是在不同浏览器、平台和分辨率测试网页显示效果,通常这会浮现许多问题,尤其浏览器版本就可能让显示成效完全不同,也只好尽力维持让每一种设备都能正常浏览网页。修改到完全没有问题必须投入不少时间,安装多系统可以解决这个问题(土豪可以配置多台机器),但是非常的麻烦繁琐,特别是不同版本的ie浏览器 。微软作为ie和windows的开发当然也知道这个问题,所以也在做这方面的工作,推出了Browser screenshots只要输入网址就能建立在不同浏览器屏幕的截取画面;

Browser Screenshots是一个在线工具,能够快速建立一个网页在不同操作系统、浏览器甚至是设备上的画面截图,方便开发者在开发网站或服务时找出问题,注意这里是给出截图,不是可以点击跳转的窗口,可以看出是一个快照;Browser Screenshots 用法非常简单,只要开启网站、输入网址,就能自动为你截取不同浏览器上呈现的网页效果。支持平台包括 Windows(IE、Chrome、Firefox、Opera)、OS X(Safari)以及 IE 6、IE 7、IE 8、IE 9 和 IE 10!还有在 Google Nexus、iPhone 及 iPad Air 测试效果。

使用方法很简单的,首先进入这个地址,页面如下:

微软官方网站线上兼容测试平台-Browser screenshots

在图上的输入框内填写要检测的页面,回车,注意这时候速度不是很快,需要等待一段时间,每个平台的截图画面才会出现。如果你想检视大图,把光标移动到截图上点选放大,并且截图是页面全屏,不只是可视区域,分类可以说非常详细,优点很直观,缺点就是无法具体操作不同浏览器中的页面,查看页面操作的效果写法,只能返回图片快照,可以当做日常快速检测兼容问题的工具;下图是测试我博客的截图:

微软官方网站线上兼容测试平台-Browser screenshots

 


薛陈磊的博客 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权 , 转载请注明微软官方网站线上兼容测试平台-Browser screenshots
喜欢 (0)
[905044086@qq.com]
分享 (0)
作者薛陈磊
关于作者:
非著名前端工程师,关注Html5、Css3、Javascript、Node.js和各种前端框架发展,学习管理技巧和团队建设方法,期待遇到更多前端小伙伴一起学习进步;
说点什么...
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址