圖片命名 規則

1 使用縮寫，button-> btn ,background->bg nav_bg.jpg 

2 分爲通用圖標和模塊圖標 , 通用圖標'功能+名稱+[狀態]' btn_share ,‘模塊+通用圖標’  profile_btn_share, 名稱儘可能短

3 鼠標感應效果 「圖片名」+「——"on/off」. 如menu1_on.png, menu1_off.png

4 高分辨率圖片 logo_db@2x.png.

5 雪碧圖 以_sprite.png結尾, slide_sprite.png, pc_icons_btns_sprite.png, 

圖片文件夾分類：

banner 頂部廣告

logo 標誌性的圖片

button 做爲連接的小圖片

icon 圖標 這個

events 活動圖片 events/nike/圖片名

common 通用的圖片

 

幾個網站的研究：

豆瓣：

1 頁面 /pics/分站/圖片名  如：pics/loc/slide_control.png 豆瓣同城的一個控件圖片

2 通用的模塊 /pics/模塊/圖片名 pics/nav/lg_location.png pics/app/app_icons.jpg

淘寶：

1 

 

 

 

 

 

引伸擴增類名：

通用icon .icon-user .icon-heart

若是想新增長一個類，app類的icon圖標 , 能夠 '"新類-" + 原類名' , app-icon app-icon-movie