使用快切助手導出頁面結構後再寫html和css?

快切助手是一款在線的切圖工具，由勤道團隊出品。

目前快切助手是1.0版本，在1.0的版本中，快切助手能夠自動分析頁面設計效果圖，並完成自動切圖，生成頁面框架的工作。從而有效減少20%-50%的前端代碼編寫工作。生成代碼符合w3c規範，特別適合導出頁面框架和製作活動專題頁面。

快切助手2.0版本目前正在開發中，2.0版本將繼續優化圖像分析功能，實現圖像檢出與自動佈局，減少30%-60%的前端代碼編寫工作。

快切助手3.0版本，將對響應式進行支持，從而一站打通手機，電腦和平板。

工具/原料

設計效果圖

方法/步驟

導入頁面效果圖，我們以京東首頁截屏為例。

設置頁寬：1210px(作者屏幕寬1280px)，間距10px，背景色默認#FFFFFF，點擊自動切圖，圖像分析工具創建頁面框架結構。

通過拆分，通欄，背景，向下合併等功能調整頁面佈局。

最後，點擊導出，設置頁面title,keywords,description等meta標籤，導出文件到本地。京東首頁的頁面結構和切片就生成了，就是這麼簡單。如果是以圖片為主的專題頁面，頁面就可以直接發佈了。618，雙11，雙12，聖誕，元旦，春節，免不了製作大量的活動頁面，減少了我們很多工作，前端有福了。

注意事項

快切助手在線使用，免安裝，基於Html5，所以建議使用firefox，或google chrome等基於webkit的瀏覽器。

網頁效果圖建議是png格式，注意不要分層。