【行動網頁規劃】layerstyles.org CSS3線上產生器

Hi! 各位朋友好,我是小蔡老師,今天要提供給各位朋友一些好用的雲端工具,目前大部份的設計都開始偏向行動裝置或者行動網頁為主要目標,所以也有很多網路上面的設計工具資源紛紛都偏向這方面為主,這次的雲端軟體就是仿PhotoShop效果轉CSS3語法作為呈現‧


網站名稱: layerstyles.org
網站支援:各類瀏覽器皆可
網站系統: Windows, Mac, Linux
官方網站:官方站點

1.
001

2.
002

說明:每一種功能皆有各自的屬性調整
● Drop Shadow 陰影
● Inner Shadow 內光暈
● Background 背景
● Border 邊框
● Border Radius 圓角

3. ● Background 背景主要分為透明度、漸層效果(線性、放射性這類的)、漸層角度
003

4. ● Background 背景 漸層效果
004

5. ● Background 背景 漸層效果控制面板
005

6. ● Border 邊框 分為 色彩、透明度、大小、類型
006

7. ● Border Radius 圓角 框框的圓邊效果
007

8. ● Drop Shadow 陰影
008

9. ● Inner Shadow 內光暈
009

10. 做完後孝果呈現如下
010

11. 在左下角點一下code就會跳出應用於網頁佣的專屬語法
013

12.
015

b. 測試後在具備HTML5+CSS3的流灠器上可以完整呈現效果
014

(BLOG 線上教學皆為雅朵美術工房所有&BLOG作品皆為設計者阿哲類所有 未經同意請勿盜連或者轉帖,違反者依法處理)

我想發問