[{"data":1,"prerenderedAt":72},["ShallowReactive",2],{"document:zh:responsive-screenshot-checker":3},{"title":4,"description":5,"body":6,"faqs":61,"tool":68,"kind":69,"slug":70,"locale":71},"响应式网页截图检查器","在手机、平板和桌面视口下截取同一网页，逐项检查布局差异。",{"type":7,"value":8,"toc":54},"minimark",[9,13,17,20,23,26,39,42],[10,11,12],"h2",{"id":12},"让网页成为可用的视觉资料",[14,15,16],"p",{},"把同一页面的三个宽度放在一起，寻找被截断的标题、拥挤的菜单或意外移动的内容，便于与设计和开发人员讨论。",[14,18,19],{},"每种视口都是独立截图。动态图片、动画和加载时间不同，也可能造成与 CSS 无关的变化，比较时请保留这个背景。",[14,21,22],{},"这是视觉检查工具，不会自动判定响应式设计合格。某个尺寸失败时可单独查看状态，保留成功结果，并按需重试失败项。",[10,24,25],{"id":25},"使用步骤",[27,28,29,33,36],"ol",{},[30,31,32],"li",{},"输入同一个公开网址。",[30,34,35],{},"检查手机、平板和桌面三个预设。",[30,37,38],{},"生成后逐张检查，下载需要的结果。",[10,40,41],{"id":41},"继续完成任务",[14,43,44,49,50],{},[45,46,48],"a",{"href":47},"\u002Fzh\u002Fmobile-website-screenshot","细看移动端"," · ",[45,51,53],{"href":52},"\u002Fzh\u002Fscreenshot-comparison","比较保存的截图",{"title":55,"searchDepth":56,"depth":56,"links":57},"",2,[58,59,60],{"id":12,"depth":56,"text":12},{"id":25,"depth":56,"text":25},{"id":41,"depth":56,"text":41},[62,65],{"question":63,"answer":64},"能证明网站兼容所有手机吗？","不能。几个尺寸的截图无法覆盖所有设备、交互行为和无障碍要求。",{"question":66,"answer":67},"失败一张要全部重做吗？","在提供单项重试时，只重试失败视口即可；成功结果可以分开查看。","responsive","tool","responsive-screenshot-checker","zh",1793599001844]