推薦給大家一款免費PS擴展插件CSS3Ps，灰常好用，可以將Photoshop圖層特效等效果直接轉為CSS3代碼，無需為了再瀏覽網頁查詢css3代碼的寫法，無需手動查看ps圖層特殊的數據來編寫css3代碼，大大提升編寫代碼的效率，走過路過的同學不過錯過哈！Come on，直接進去正題吧！！！
下圖為Photoshop CS5圖層的混合選項菜單。
有了CSS3Ps，上面的特效可以直接導出CSS3代碼~
以webkit瀏覽器為主的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);
模塊內發光：-webkit-box-shadow:inset 0 0 17px rgba(255,255,190,.41);
文本內發光：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代碼，操作起來十分簡單...
設計稿示例PSD源文件：
安裝CSS3PS官方視頻教程：
CSS3PS下載地址：
針對Adobe Photoshop CS5和CS6的版本下載
針對Adobe Photoshop CS3和CS4的版本下載
針對Photoshop CS5和CS6版本的安裝過程（來至官方教程）：
1.如果Adobe Photoshop的運行，將其關閉。
2.下載“CSS3Ps.zpx”文件。
3.在Adobe Extension Manager中點擊“Accept”按鈕。
4.當安裝程序完成后，你會看到以下的畫面。現在你可以運行Adobe Photoshop。
5.在Adobe Photoshop中選中“窗口”- >“擴展” - >“ CSS3Ps”菜單項。
6.恭喜！現在，您可以選擇您的層並轉換他們CSS了。
在Photoshop CS3和CS4中使用腳本（來至官方教程）
1.選擇你要轉換的層
2.選擇“文件” - >“腳本” - >“瀏覽...” 菜單項
3.選擇“CSS3Ps.jsx”文件
4.該腳本將運行並打開一個瀏覽器窗口的轉換結果
