CSS3Ps圖層轉CSS3代碼工具是一款PhotoShop軟件上使用的可以将图层转为CSS3代码的小插件，该插件具有绿色安全，功能强大的特点，它可以帮助用户将PhotoShop上的图层转为CSS3代码。如果你有需要，就来本站下载使用吧！

安裝方法

1、對該文件進行重命名，將後綴改成zxp，圖標將會變成

2、打开Adobe Extension Manager来安装

3、找到文件下載的目錄選擇

4、下一步選擇css3ps.zxp

5、點擊接受並開始下一步安裝

6、安装后可以在軟件工具栏查看插件具体信息

使用說明

我特定自己嘗試了一下：

我目前使用的是CS6, 因此，下载的是下面这个文件(PS3/PS4使用参见官方示意)，双击之：

然後就會出現下面這個：

然後下面這個：

然後就會下面這樣：

接受之，然後就會：

如上，安装完毕。此时，重启或打开photoshop，点击window(窗口) -> Extension(扩展) -> CSS3Ps 就会出现一个方块区域，见下图右侧：

下面變身設計師，畫個圓角矩形，搞個漸變投影什麽的，選中該圖層，然後點擊上面那個有CSS3Ps字樣的方框區域：

默認的浏覽器就會打開，稍等一段時間後，就會出現下面這個：

至此，個人親測完畢。

問題答疑

如果安裝失敗，可以嘗試以下方法：

把压缩包里面的文件放到Css安装目录下 Plug-ins\Panels 文件夹中即可

X:\Adobe\Adobe Photoshop CC (64 Bit)\Plug-ins\Panels

特色技巧

可以將Photoshop圖層特效等效果直接轉爲CSS3代碼，無需爲了再浏覽網頁查詢css3代碼的寫法，無需手動查看ps圖層特殊的數據來編寫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);

模块内发光：-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代碼，操作起來十分簡單

注意事項

能夠識別成CSS3的圖層是有限制的。例如，漸變CSS3似乎只能使用圖層樣式的漸變才能識別，投影、描邊等都盡量使用fx圖層樣式

圓角需要使用圓角矩形工具，而且似乎要保留路徑。這是參數獲取所必須的。