圖片合成方法及裝置與流程

本發明涉及互聯網技術領域，特別是涉及一種圖片合成方法及裝置。

背景技術：

提高網頁顯示速度最有效的一個方法是減少頁面的HTTP(HyperText Transfer Protocol，超文本傳輸協議)請求次數。目前，在網頁制作時通常采用精靈圖片技術，以減少HTTP請求次數。精靈圖片技術可以將許多圖片放到一張大圖片里面，通過CSS(Cascading Style Sheets，層疊樣式表)來顯示圖片的一部分。

精靈圖片是由網頁制作技術人員在制作網頁過程中、通過一定技術手段制作而成的，現有的精靈圖片制作方案具體包括：訪問系統預設的圖片庫，其中，圖片庫中存儲有多個子圖片；按順序從該圖片庫中依次拉取子圖片至精靈圖片生成界面中，最終將拉取的各子圖片合成為精靈圖片，并生成精靈圖片對應的CSS。

發明人在實施本發明的過程中發現，現有的精靈圖片制作方案至少存在如下問題：當需要對已生成的精靈圖片中的某子圖片執行替換、或者刪除等更新操作時，需要網頁制作技術人員重新訪問上述圖片庫，按照新的順序依次拉取各子圖片至精靈圖片生成界面中，合并成精靈圖片，也即精靈圖片的更新過程較為繁瑣；而隨著互聯網技術的快速發展，網頁更新速度有增無減，現有的精靈圖片制作方案勢必會花費網頁制作人員大量的時間，既耗費了大量的人力成本，又影響了精靈圖片的更新效率。

技術實現要素：

鑒于現有的精靈圖片生成方案中存在的精靈圖片更新過程繁瑣，既占用人力資源又影響精靈圖片的更新效率的問題，提出了本發明以便提供一種克服上述問題的圖片合成方法及裝置。

依據本發明的一個方面，提供了一種圖片合成方法，其中，所述方法包括：響應于對于待合成子圖片的添加指令，將所述待合成子圖片添加至子圖片目錄中，以得到所述子圖片目錄中的子圖片；依據所述子圖片目錄中的各子圖片，合成得到對應的第一目標圖片；確定所述第一目標圖片的存儲路徑；依據所述子圖片目錄中的各子圖片對應的合成信息、以及所述第一目標圖片的存儲路徑，生成所述第一目標圖片對應的Less文件。

可選地，所述方法還包括：將所述第一目標圖片對應的Less文件導入所述網頁的主Less文件中；對導入所述Less文件后的主Less文件進行編譯，以得到所述第一目標圖片對應的層疊樣式表CSS。

可選地，所述方法還包括：在生成所述第一目標圖片對應的Less文件后，對所述第一目標圖片對應的子圖片目錄進行更新；依據更新后的子圖片目錄，得到對應的第二目標圖片、以及所述第二目標文件對應的Less文件。

可選地，所述對所述第一目標圖片對應的子圖片目錄進行更新的步驟，包括：接收對待添加子圖片的添加指令；響應所述添加指令，將所述待添加圖片添加至所述子圖片目錄中。

可選地，所述對所述第一目標圖片對應的子圖片目錄進行更新的步驟，包括：接收對待替換子圖片的添加指令；采用所述待替換圖片，對應替換所述子圖片目錄中被替換的子圖片。

可選地，所述對所述第一目標圖片對應的子圖片目錄進行更新的步驟，包括：接收對所述子圖片目錄中待刪除子圖片的刪除指令；響應所述刪除指令，將所述待刪除子圖片從所述子圖片目錄中刪除。

依據本發明的另一個方面，提供了一種圖片合成裝置，其中，所述裝置包括：添加模塊，用于響應于對于待合成子圖片的添加指令，將所述待合成子圖片添加至子圖片目錄中，以得到所述子圖片目錄中的子圖片；合成模塊，用于依據所述子圖片目錄中的各子圖片，合成得到對應的第一目標圖片；路徑確定模塊，用于確定所述第一目標圖片的存儲路徑；文件生成模塊，用于依據所述子圖片目錄中的各子圖片對應的合成信息、以及所述第一目標圖片的存儲路徑，生成所述第一目標圖片對應的Less文件。

可選地，所述裝置還包括：導入模塊，用于將所述第一目標圖片對應的Less文件導入所述網頁的主Less文件中；編譯模塊，用于對導入所述Less文件后的主Less文件進行編譯，以得到所述第一目標圖片對應的層疊樣式表CSS。

可選地，所述裝置還包括：目錄更新模塊，用于在生成所述第一目標圖片對應的Less文件后，對所述第一目標圖片對應的子圖片目錄進行更新；文件更新模塊，用于依據更新后的子圖片目錄，得到對應的第二目標圖片、以及所述第二目標文件對應的Less文件。

可選地，所述目錄更新模塊包括：第一指令接收子模塊，用于接收對待添加子圖片的添加指令；添加子模塊，用于響應所述添加指令，將所述待添加圖片添加至所述子圖片目錄中。

可選地，所述目錄更新模塊包括：第二指令接收子模塊，用于接收對待替換子圖片的添加指令；替換子模塊，用于采用所述待替換圖片，對應替換所述子圖片目錄中被替換的子圖片。

可選地，所述目錄更新模塊包括：第三指令接收子模塊，用于接收對所述子圖片目錄中待刪除子圖片的刪除指令；刪除子模塊，用于響應所述刪除指令，將所述待刪除子圖片從所述子圖片目錄中刪除。

本發明實施例提供的圖片合成方法及裝置，將待添加的各子圖片添加至一個專屬子圖片目錄中，然后將子圖片目錄中的全部子圖片合并成第一目標圖片即精靈圖片，并且還為第一目標圖片生成對應的Less文件。由于上述第一目標圖片具有對應的專屬子圖片目錄，這樣，當需要對第一目標圖片中的某子圖片進行例如修改或替換的更新操作時，可以直接對其對應的子圖片目錄中子圖片進行更新，再依據更新后的子圖片目錄合并成精靈圖片并生成對應的Less文件即可。由于本發明實施例可以通過子圖片目錄的更新實現第一目標圖片的更新，故能夠提高第一目標圖片的更新過程的便捷性和更新效率，且能夠節省第一目標圖片的更新所需的人力成本。

上述說明僅是本發明技術方案的概述，為了能夠更清楚了解本發明的技術手段，而可依照說明書的內容予以實施，并且為了讓本發明的上述和其它目的、特征和優點能夠更明顯易懂，以下特舉本發明的具體實施方式。

附圖說明

通過閱讀下文優選實施方式的詳細描述，各種其他的優點和益處對于本領域普通技術人員將變得清楚明了。附圖僅用于示出優選實施方式的目的，而并不認為是對本發明的限制。而且在整個附圖中，用相同的參考符號表示相同的部件。在附圖中：

圖1示出了根據本發明一個實施例的一種圖片合成方法的步驟流程示意圖；

圖2示出了根據本發明一個實施例的一種圖片合成方法的步驟流程示意圖；

圖3示出了根據本發明一個實施例的一種圖片合成方法的步驟流程示意圖；

圖4示出了根據本發明一個實施例的一種圖片合成裝置的結構示意圖；以及

圖5示出了根據本發明一個實施例的一種圖片合成裝置的結構示意圖。

具體實施方式

下面將參照附圖更詳細地描述本公開的示例性實施例。雖然附圖中顯示了本公開的示例性實施例，然而應當理解，可以以各種形式實現本公開而不應被這里闡述的實施例所限制。相反，提供這些實施例是為了能夠更透徹地理解本公開，并且能夠將本公開的范圍完整的傳達給本領域的技術人員。

實施例一

參照圖1，示出了本發明一個實施例的一種圖片合成方法的步驟流程示意圖，具體可以包括如下步驟：

步驟101：響應于對于待合成子圖片的添加指令，將待合成子圖片添加至子圖片目錄中，以得到子圖片目錄中的子圖片。

多個子圖片可以合成一個精靈圖片即目標圖片。待合成子圖片可以為本地存儲的圖片，也可以為從網絡上下載至本地的圖片。

待合成子圖片的個數可以由網頁制作技術人員根據實際需求進行設置，本發明實施例中對此不作具體限制。合成后的精靈圖片可以作為網頁的背景圖片，也可以為網頁中的包含的圖片。

在實際應用中，制作網頁時需要合成一副或者多副精靈圖片，本發明實施例中以對一個精靈圖片進行合成為例進行說明，可以理解，可以重復執行本發明實施例中的圖片合成流程，以實現多副精靈圖片的制作，本發明實施例對于具體的應用場景不加以限制。

本發明實施例中，合成得到的目標圖片可以具有對應的專屬子圖片目錄，可選地，該目標圖片與子圖片目錄之間可以為一一對應的關系，該子圖片目錄可以作為目標圖片的合成依據。

步驟102：依據子圖片目錄中的各子圖片，合成得到對應的第一目標圖片。

在實際應用中，可以將子圖片目錄中的全部子圖片合成至第一目標圖片中。可選地，可以依據子圖片目錄中的各子圖片的合成信息，將子圖片目錄中的全部子圖片合成至第一目標圖片中；其中，合成信息可以包括但不限于：子圖片對應的存儲路徑、尺寸、類以及子圖片在第一目標圖片中的位置信息。可以理解，本發明實施例對于依據子圖片目錄中的各子圖片，合成得到對應的第一目標圖片的具體過程不加以限制。

步驟103：確定第一目標圖片的存儲路徑。

確定第一目標圖片的存儲路徑，目的是在第一目標圖片對應的Less文件中添加該存儲路徑，以便后續將第一目標圖片對應的CSS添加至某網頁CSS中后顯示該網頁時，依據該存儲路徑獲取第一目標圖片。

步驟104：依據子圖片目錄中的各子圖片對應的合成信息以及第一目標圖片的存儲路徑，生成第一目標圖片對應的Less文件。

在執行步驟104之前，可以針對子圖片目錄中的每個子圖片，確定子圖片對應的合成信息。可選地，上述合成信息可以包括但不限于：子圖片對應的存儲路徑、尺寸、類以及子圖片在第一目標圖片中的位置信息。其中，通過子圖片的存儲路徑可以獲取子圖片內容；子圖片對應的類添加至第一圖片對應的Less文件中，一旦第一目標圖片被應用到網頁中，該Less文件將被引入最終編譯成CSS，而CSS是對網頁的HTML標簽樣式的定義，因此，子圖片對應的類將標識在該網頁的HTML上。

Less文件是基于Less語言生成的文件。Less語言是一門CSS預處理語言，它擴展了CSS語言，增加了變量、函數等特性，Less可以運行在Node或瀏覽器端。所生成的Less文件對于網頁制作技術人員而言是可視的，從Less文件中可以拿到每個子圖片對應的合成信息以及第一目標圖片的存儲路徑，這樣，可以通過Less文件通過編程類型選項就像變量和操作擴展標準的CSS添加靈活性，Less文件的代碼被編譯成CSS；且當一個頁面被加載或使用命令行工具時，Less文件還可以被編譯成瀏覽器中的JavaScript。

綜上，本發明實施例的圖片合成方法，將待添加的各子圖片添加至一個專屬子圖片目錄中，然后將子圖片目錄中的全部子圖片合并成第一目標圖片即精靈圖片，并且還為第一目標圖片生成對應的Less文件。由于上述第一目標圖片具有對應的專屬子圖片目錄，這樣，當需要對第一目標圖片中的某子圖片進行例如修改或替換的更新操作時，可以直接對其對應的子圖片目錄中子圖片進行更新，再依據更新后的子圖片目錄合并成精靈圖片并生成對應的Less文件即可。由于本發明實施例可以通過子圖片目錄的更新實現第一目標圖片的更新，故能夠提高第一目標圖片的更新過程的便捷性和更新效率，且能夠節省第一目標圖片的更新所需的人力成本。

實施例二

參照圖2，示出了本發明一個實施例的一種圖片合成方法的步驟流程示意圖，具體可以包括如下步驟：

步驟201：響應于對于待合成子圖片的添加指令，將待合成子圖片添加至子圖片目錄中，以得到子圖片目錄中的子圖片。

本發明實施例中，可以基于例如spritesmith(精靈史密斯)、spritesheet-templates(精靈表單模板)的圖片處理工具封裝一個Node(節點)程序，供網頁制作技術人員使用，該Node程序可以通過執行本發明實施例的圖片合成流程，進行圖片合成，最終得到所需的精靈圖片。

步驟202：依據子圖片目錄中的各子圖片，合成得到對應的第一目標圖片。

步驟203：確定第一目標圖片的存儲路徑。

確定第一目標圖片的存儲路徑，目的是在第一目標圖片對應的Less文件中添加該存儲路徑，以便后續將第一目標圖片對應的CSS添加至某網頁CSS中后顯示該網頁時，獲取第一目標圖片時依據該存儲路徑獲取第一目標圖片。

步驟204：依據子圖片目錄中的各子圖片對應的合成信息以及第一目標圖片的存儲路徑，生成第一目標圖片對應的Less文件。每個子圖片對應的類不同，子圖片對應的類最終將標識在該網頁的HTML上。

步驟205：當將第一目標圖片添加至網頁中時，將第一目標圖片對應的Less文件導入網頁的主Less文件中。

網頁的主Less文件為網頁制作技術人員開發或編輯的用于網頁制作的Less文件。主Less文件通常包含：引入Less文件的程序、以及對引入Less文件進行處理的程序。

網頁的主Less文件中可以導入多個Less文件，也可以僅導入一個Less文件。例如：該網頁中需要插入兩個精靈圖片時，則需要導入兩個Less文件以及其他頁面元素對應的Less文件，而若僅需要導入一個精靈圖片時，則需要導入一個Less文件以及其他頁面元素對應的Less文件。

步驟206：對導入Less文件后的主Less文件進行編譯，以得到第一目標圖片對應的CSS。

第一圖標圖片對應的CSS中可以包括：第一目標圖片包含的各子圖片對應的CSS信息；每個子圖片對應的CSS信息可以包括：子圖片的類、在第一目標圖片中的位置信息、尺寸以及第一目標圖片的存儲路徑。其中，尺寸信息可以包括子圖片寬度信息、高度信息；子圖片在第一目標圖片中的位置信息可以為子圖片在第一目標圖片中的坐標信息。

對于將Less文件編譯成對應的CSS的具體編譯過程，參見相關技術即可，例如，可以采用Less開發工具進行主Less文件的編譯，本發明實施例中對此不作具體限制。

綜上，本發明實施例提供的圖片合成方法，將目標圖片添加至網頁中時，將目標圖片對應的Less文件導入網頁的主Less文件中后進行編譯，即可得到目標圖片對應的CSS，目標圖片的添加過程便捷，且易于操作。

實施例三

參照圖3，示出了本發明一個實施例的一種圖片合成方法的步驟流程示意圖，具體可以包括如下步驟：

本發明實施例中以生成一個目標圖片，并對所生成的該目標圖片進行修改為例，對本發明實施例的圖片合成方法進行說明。

步驟301：響應于對于待合成子圖片的添加指令，將待合成子圖片添加至子圖片目錄中，以得到子圖片目錄中的子圖片。

步驟302：依據子圖片目錄中的各子圖片，合成得到對應的第一目標圖片。

例如：子圖片目錄中包括A、B、C以及D四個子圖片，這四個子圖片在子圖片目錄中順次排列。生成第一目標圖片時，第一目標圖片中包含子圖片目錄中的這四個子圖片，并且各子圖片按照在圖片目錄中的排序在第一目標圖片中排列。

步驟303：確定第一目標圖片的存儲路徑。

確定第一目錄體圖片的存儲路徑，在第一目標圖片對應的Less文件中添加該存儲路徑，以便后續將第一目標圖片對應的CSS添加至某網頁CSS中后顯示該網頁時，獲取第一目標圖片時依據該存儲路徑獲取第一目標圖片。此外，當需要對第一目標圖片進行更新時，還可以依據該存儲路徑將更新后的目標圖片存儲至該路徑下，替換第一目標圖片。

步驟304：依據子圖片目錄中的各子圖片對應的合成信息以及第一目標圖片的存儲路徑，生成第一目標圖片對應的Less文件。

每個子圖片對應的類由系統為子圖片分配。不僅如此，每個子圖片還可以對應有圖片名稱。每個子圖片對應的類不同，子圖片對應的類最終將標識在該網頁的HTML上。

至此，一個目標圖片即精靈文件已制作完成。后續若需要對第一目標圖片中的某子圖片進行刪除、修改，或者向第一目標圖片中添加子圖片，將第一目標圖片更新為第二目標圖片時，則可執行步驟305至步驟306中所示的流程。

步驟305：對第一目標圖片對應的子圖片目錄進行更新。

步驟306：依據更新后的子圖片目錄，得到對應的第二目標圖片、以及第二目標文件對應的Less文件。

其中，對子圖片目錄進行更新的方式可以包括但不限于：向子圖片目錄中添加子圖片、將子圖片目錄中的某子圖片刪除、以及將子圖片目錄中的某子圖片進行替換。

具體地，當欲要刪除第一目標圖片中添加的子圖片時，接收對子圖片目錄中待刪除子圖片的刪除指令，響應刪除指令，將待刪除子圖片刪除，以完成對子圖片目錄的更新；依據更新后的子圖片目錄，得到對應的第二目標圖片、以及第二目標文件對應的Less文件。

對圖片的刪除指令可以為任意適當的操作，本發明實施例中對此不作具體限制。例如：在子圖片目錄中對某子圖片的雙擊操作、右擊并選擇刪除選項的操作或者將子圖片從子圖片目錄中拖出的操作。

例如：子圖片目錄中包括A、B、C以及D四個子圖片，待刪除子圖片B刪除后，子圖片目錄中將包括A、C以及D三個子圖片。

具體地，在生成第一目標圖片對應的Less文件之后，當向第一目標圖片中添加子圖片時，接收對待添加子圖片的添加指令；響應添加指令將待添加圖片添加至子圖片目錄中，以更新子圖片目錄；依據更新后的子圖片目錄，得到對應的第二目標圖片、以及第二目標文件對應的Less文件。

具體地，在生成第一目標圖片對應的Less文件之后，當欲要替換第一目標圖片中添加的子圖片時，接收對待替換子圖片的添加指令；采用待替換圖片，對應替換子圖片目錄中被替換的子圖片以更新子圖片目錄，也即，可以將被替換的子圖片替換為待替換圖片；依據更新后的子圖片目錄，得到對應的第二目標圖片、以及第二目標文件對應的Less文件。

與生成第一目標圖片對應的Less文件的過程相似，生成第二目標圖片對應的Less文件的過程可以包括：依據更新后的子圖片目錄中各子圖片對應的合成信息以及第二目標圖片的存儲路徑，生成第二目標圖片對應的Less文件。第二目標圖片的存儲路徑與第一目標圖片的存儲路徑相同，第二目標圖片生成后，將替換第一目標圖片，并且第二目標圖片對應的Less文件將替換第一目標圖片對應的Less文件。

在實際應用中，在需要對第一目標圖片進行修改時，還可以將第一目標圖片對應的子圖片目錄復制，針對復制后的子圖片目錄中子圖片執行例如刪除、添加、或者替換的更新操作，以生成新的子圖片目錄，進而依據新的子圖片目錄生成第二目標圖片；并且為生成的第二目標圖片分配新的存儲路徑。這樣，所生成的第二目標圖片將可以與第一目標圖片同時存在，并且兩目標圖片對應的Less文件也可以同時存在。

綜上，本發明實施例提供的圖片合成方法，在對已合成的目標圖片進行更新的過程中時，可以對該目標圖片對應的子圖片目錄進行適應性更新，通過修改后的子圖片目錄即可生成更新后的目標圖片；由于上述子圖片目錄為已合成的目標圖片對應的專屬子圖片目錄，故上述子圖片目錄的容量遠小于現有方案的圖片庫，因此本發明實施例能夠簡化已合成的目標圖片的更新流程，節省已合成的目標圖片的更新所需的操作成本，提高已合成的目標圖片的更新效率。

實施例四

參照圖4，示出了本發明實施例四的一種圖片合成裝置的結構示意圖。

本發明實施例的圖片合成裝置可以包括：添加模塊401，用于響應于對于待合成子圖片的添加指令，將所述待合成子圖片添加至子圖片目錄中，以得到所述子圖片目錄中的子圖片；合成模塊402，用于依據所述子圖片目錄中的各子圖片，合成得到對應的第一目標圖片；路徑確定模塊403，用于確定所述第一目標圖片的存儲路徑；文件生成模塊404，用于依據所述子圖片目錄中的各子圖片對應的合成信息以及所述第一目標圖片的存儲路徑，生成所述第一目標圖片對應的Less文件。

通過本發明實施例提供的圖片合成裝置，將待添加的各子圖片添加至一個專屬子圖片目錄中，然后將子圖片目錄中的全部子圖片合并成第一目標圖片即精靈圖片，并且還為第一目標圖片生成對應的Less文件。由于上述第一目標圖片具有對應的專屬子圖片目錄，這樣，當需要對第一目標圖片中的某子圖片進行例如修改或替換的更新操作時，可以直接對其對應的子圖片目錄中子圖片進行更新，再依據更新后的子圖片目錄合并成精靈圖片并生成對應的Less文件即可。由于本發明實施例可以通過子圖片目錄的更新實現第一目標圖片的更新，故能夠提高第一目標圖片的更新過程的便捷性和更新效率，且能夠節省第一目標圖片的更新所需的人力成本。

實施例五

參照圖5，示出了本發明實施例五的一種圖片合成裝置的結構示意圖。

本發明實施例是對實施例四中的圖片合成裝置的進一步優化，優化后的圖片合成裝置可以包括：添加模塊501，用于響應于對于待合成子圖片的添加指令，將所述待合成子圖片添加至子圖片目錄中，以得到所述子圖片目錄中的子圖片；合成模塊502，用于依據所述子圖片目錄中的各子圖片，合成得到對應的第一目標圖片；路徑確定模塊503，用于確定所述第一目標圖片的存儲路徑；文件生成模塊504，用于依據所述子圖片目錄中的各子圖片對應的合成信息以及所述第一目標圖片的存儲路徑，生成所述第一目標圖片對應的Less文件。

優選地，所述裝置還包括：導入模塊505，用于將所述第一目標圖片對應的Less文件導入所述網頁的主Less文件中；編譯模塊506，用于對導入所述Less文件后的主Less文件進行編譯，以得到所述第一目標圖片對應的層疊樣式表CSS。

優選地，所述裝置還包括：目錄更新模塊507，用于在生成所述第一目標圖片對應的Less文件后，對所述第一目標圖片對應的子圖片目錄進行更新；文件更新模塊508，用于依據更新后的子圖片目錄，得到對應的第二目標圖片、以及所述第二目標文件對應的Less文件。

優選地，所述目錄更新模塊包括：第一指令接收子模塊，用于接收對待添加子圖片的添加指令；添加子模塊，用于響應所述添加指令將所述待添加圖片添加至所述子圖片目錄中。

優選地，所述目錄更新模塊包括：第二指令接收子模塊，用于接收對待替換子圖片的添加指令；替換子模塊，用于采用所述待替換圖片，對應替換所述子圖片目錄中被替換的子圖片。

優選地，所述目錄更新模塊包括：第三指令接收子模塊，用于接收對所述子圖片目錄中待刪除子圖片的刪除指令；刪除子模塊，用于響應所述刪除指令，將所述待刪除子圖片從所述子圖片目錄中刪除。

本實施例的圖片合成裝置用于實現前述實施例一以及實施例二中相應的圖片合成方法，并且具有相應的方法實施例的有益效果，在此不再贅述。

本說明書中的各個實施例均采用遞進的方式描述，每個實施例重點說明的都是與其他實施例的不同之處，各個實施例之間相同相似的部分互相參見即可。對于系統實施例而言，由于其與方法實施例基本相似，所以描述的比較簡單，相關之處參見方法實施例的部分說明即可。

在此提供的圖片合成方法及裝置不與任何特定計算機、虛擬系統或者其它設備固有相關。各種通用系統也可以與基于在此的示教一起使用。根據上面的描述，構造具有本發明方案的系統所要求的結構是顯而易見的。此外，本發明也不針對任何特定編程語言。應當明白，可以利用各種編程語言實現在此描述的本發明的內容，并且上面對特定語言所做的描述是為了披露本發明的最佳實施方式。

在此處所提供的說明書中，說明了大量具體細節。然而，能夠理解，本發明的實施例可以在沒有這些具體細節的情況下實踐。在一些實例中，并未詳細示出公知的方法、結構和技術，以便不模糊對本說明書的理解。

類似地，應當理解，為了精簡本公開并幫助理解各個發明方面中的一個或多個，在上面對本發明的示例性實施例的描述中，本發明的各個特征有時被一起分組到單個實施例、圖、或者對其的描述中。然而，并不應將該公開的方法解釋成反映如下意圖：即所要求保護的本發明要求比在每個權利要求中所明確記載的特征更多的特征。更確切地說，如權利要求書所反映的那樣，發明方面在于少于前面公開的單個實施例的所有特征。因此，遵循具體實施方式的權利要求書由此明確地并入該具體實施方式，其中每個權利要求本身都作為本發明的單獨實施例。

本領域那些技術人員可以理解，可以對實施例中的設備中的模塊進行自適應性地改變并且把它們設置在與該實施例不同的一個或多個設備中。可以把實施例中的模塊或單元或組件組合成一個模塊或單元或組件，以及此外可以把它們分成多個子模塊或子單元或子組件。除了這樣的特征和/或過程或者單元中的至少一些是相互排斥之外，可以采用任何組合對本說明書(包括伴隨的權利要求、摘要和附圖)中公開的所有特征以及如此公開的任何方法或者設備的所有過程或單元進行組合。除非另外明確陳述，本說明書(包括伴隨的權利要求、摘要和附圖)中公開的每個特征可以由提供相同、等同或相似目的的替代特征來代替。

此外，本領域的技術人員能夠理解，盡管在此所述的一些實施例包括其它實施例中所包括的某些特征而不是其它特征，但是不同實施例的特征的組合意味著處于本發明的范圍之內并且形成不同的實施例。例如，在權利要求書中，所要求保護的實施例的任意之一都可以以任意的組合方式來使用。

本發明的各個部件實施例可以以硬件實現，或者以在一個或者多個處理器上運行的軟件模塊實現，或者以它們的組合實現。本領域的技術人員應當理解，可以在實踐中使用微處理器或者數字信號處理器(DSP)來實現根據本發明實施例的圖片合成方法及裝置中的一些或者全部部件的一些或者全部功能。本發明還可以實現為用于執行這里所描述的方法的一部分或者全部的設備或者裝置程序(例如，計算機程序和計算機程序產品)。這樣的實現本發明的程序可以存儲在計算機可讀介質上，或者可以具有一個或者多個信號的形式。這樣的信號可以從因特網網站上下載得到，或者在載體信號上提供，或者以任何其他形式提供。

應該注意的是上述實施例對本發明進行說明而不是對本發明進行限制，并且本領域技術人員在不脫離所附權利要求的范圍的情況下可設計出替換實施例。在權利要求中，不應將位于括號之間的任何參考符號構造成對權利要求的限制。單詞“包含”不排除存在未列在權利要求中的元件或步驟。位于元件之前的單詞“一”或“一個”不排除存在多個這樣的元件。本發明可以借助于包括有若干不同元件的硬件以及借助于適當編程的計算機來實現。在列舉了若干裝置的單元權利要求中，這些裝置中的若干個可以是通過同一個硬件項來具體體現。單詞第一、第二、以及第三等的使用不表示任何順序。可將這些單詞解釋為名稱。

本發明實施例公開了A1、一種圖片合成方法，其中，所述方法包括：

響應于對于待合成子圖片的添加指令，將所述待合成子圖片添加至子圖片目錄中，以得到所述子圖片目錄中的子圖片；

依據所述子圖片目錄中的各子圖片，合成得到對應的第一目標圖片；

確定所述第一目標圖片的存儲路徑；

依據所述子圖片目錄中的各子圖片對應的合成信息、以及所述第一目標圖片的存儲路徑，生成所述第一目標圖片對應的Less文件。

A2、如A1所述的方法，其中，所述方法還包括：

將所述第一目標圖片對應的Less文件導入所述網頁的主Less文件中；

對導入所述Less文件后的主Less文件進行編譯，以得到所述第一目標圖片對應的層疊樣式表CSS。

A3、如A1所述的方法，其中，所述方法還包括：

在生成所述第一目標圖片對應的Less文件后，對所述第一目標圖片對應的子圖片目錄進行更新；

依據更新后的子圖片目錄，得到對應的第二目標圖片、以及所述第二目標文件對應的Less文件。

A4、如A3所述的方法，其中，所述對所述第一目標圖片對應的子圖片目錄進行更新的步驟，包括：

接收對待添加子圖片的添加指令；

響應所述添加指令，將所述待添加圖片添加至所述子圖片目錄中。

A5、如A3所述的方法，其中，所述對所述第一目標圖片對應的子圖片目錄進行更新的步驟，包括：

接收對待替換子圖片的添加指令；

采用所述待替換圖片，對應替換所述子圖片目錄中被替換的子圖片。

A6、如A3所述的方法，其中，所述對所述第一目標圖片對應的子圖片目錄進行更新的步驟，包括：

接收對所述子圖片目錄中待刪除子圖片的刪除指令；

響應所述刪除指令，將所述待刪除子圖片從所述子圖片目錄中刪除。

本發明實施例還公開了B7、一種圖片合成裝置，其中，所述裝置包括：

添加模塊，用于響應于對于待合成子圖片的添加指令，將所述待合成子圖片添加至子圖片目錄中，以得到所述子圖片目錄中的子圖片；

合成模塊，用于依據所述子圖片目錄中的各子圖片，合成得到對應的第一目標圖片；

路徑確定模塊，用于確定所述第一目標圖片的存儲路徑；

文件生成模塊，用于依據所述子圖片目錄中的各子圖片對應的合成信息、以及所述第一目標圖片的存儲路徑，生成所述第一目標圖片對應的Less文件。

B8、如B7所述的裝置，其中，所述裝置還包括：

導入模塊，用于將所述第一目標圖片對應的Less文件導入所述網頁的主Less文件中；

編譯模塊，用于對導入所述Less文件后的主Less文件進行編譯，以得到所述第一目標圖片對應的層疊樣式表CSS。

B9、如B7所述的裝置，其中，所述裝置還包括：

目錄更新模塊，用于在生成所述第一目標圖片對應的Less文件后，對所述第一目標圖片對應的子圖片目錄進行更新；

文件更新模塊，用于依據更新后的子圖片目錄，得到對應的第二目標圖片、以及所述第二目標文件對應的Less文件。

B10、如B9所述的裝置，其中，所述目錄更新模塊包括：第一指令接

收子模塊，用于接收對待添加子圖片的添加指令；

添加子模塊，用于響應所述添加指令，將所述待添加圖片添加至所述子圖片目錄中。

B11、如B9所述的裝置，其中，所述目錄更新模塊包括：

第二指令接收子模塊，用于接收對待替換子圖片的添加指令；

替換子模塊，用于采用所述待替換圖片，對應替換所述子圖片目錄中被替換的子圖片。

B12、如B9所述的裝置，其中，所述目錄更新模塊包括：

第三指令接收子模塊，用于接收對所述子圖片目錄中待刪除子圖片的刪除指令；

刪除子模塊，用于響應所述刪除指令，將所述待刪除子圖片從所述子圖片目錄中刪除。