- 綠色版查看
- 綠色版查看
- 綠色版查看
- 綠色版查看
- 綠色版查看
安裝說明
1、對該文件進行重命名，將后綴改成zxp，圖標將會變成
2、打開Adobe Extension Manager來安裝
3、找到文件下載的目錄選擇
4、下一步選擇css3ps.zxp
5、點擊接受并開始下一步安裝
6、安裝后可以在軟件工具欄查看插件具體信息
使用方法
我特定自己嘗試了一下：
我目前使用的是CS6, 因此，下載的是下面這個文件（PS3/PS4使用參見官方示意），雙擊之：
然后就會出現(xiàn)下面這個：
然后下面這個：
然后就會下面這樣：
接受之，然后就會：
如上，安裝完畢。此時，重啟或打開photoshop，點擊window(窗口) -> Extension(擴展) -> CSS3Ps 就會出現(xiàn)一個方塊區(qū)域，見下圖右側：
下面變身設計師，畫個圓角矩形，搞個漸變投影什么的，選中該圖層，然后點擊上面那個有CSS3Ps字樣的方框區(qū)域：
默認的瀏覽器就會打開，稍等一段時間后，就會出現(xiàn)下面這個：
至此，個人親測完畢。
常見問題
如果安裝失敗，可以嘗試以下方法：
把壓縮包里面的文件放到Css安裝目錄下 Plug-insPanels 文件夾中即可
X:AdobeAdobe Photoshop CC (64 Bit)Plug-insPanels
使用技巧
可以將Photoshop圖層特效等效果直接轉為CSS3代碼，無需為了再瀏覽網頁查詢css3代碼的寫法，無需手動查看ps圖層特殊的數(shù)據來編寫css3代碼，大大提升編寫代碼的效率
混合選項菜單
有了CSS3Ps，上面的特效可以直接導出CSS3代碼~
圓角邊框：-webkit-border-radius: 5px;
模塊陰影：-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.45);
模塊內陰影：-webkit-box-shadow: inset 0 20px rgba(255,255,255,.55);
文本陰影：text-shadow: 3px 4px 5px rgba(4,0,0,.75);
文本內陰影：text-shadow: inset 3px 4px 5px rgba(0,0,0,.75);
模塊內發(fā)光：-webkit-box-shadow:inset 0 0 17px rgba(255,255,190,.41);
文本內發(fā)光：text-shadow: inset 0 0 5px rgba(249,247,189,.75);
線性漸變：-webkit-linear-gradient(bottom, rgba(222,0,120,.74), rgba(255,150,0,.74));
這些效果，只要一鍵即可轉化為css3代碼，操作起來十分簡單
注意事項
能夠識別成CSS3的圖層是有限制的。例如，漸變CSS3似乎只能使用圖層樣式的漸變才能識別，投影、描邊等都盡量使用fx圖層樣式
圓角需要使用圓角矩形工具，而且似乎要保留路徑。這是參數(shù)獲取所必須的。
您的評論需要經過審核才能顯示
有用
有用
有用