[{"data":1,"prerenderedAt":72},["ShallowReactive",2],{"document:zh-tw:screenshot-comparison":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],{},"像素差異只表示顏色改變，不代表修改一定有問題。字型、邊緣平滑與動畫也可能造成合理的差異。",[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-tw\u002Fscreenshot-image-converter","轉換圖片格式"," · ",[45,51,53],{"href":52},"\u002Fzh-tw\u002Fresponsive-screenshot-checker","擷取不同寬度",{"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},"能直接比較兩個網址嗎？","此頁比較本機圖片。請先分別擷取網頁，再選取兩張截圖。","compare","tool","screenshot-comparison","zh-tw",1793599002115]