Photoshop(簡稱PS)和CSS陰影的換算是Web設(shè)計中常用的技巧,讓我們來看看具體的換算方式。
/* CSS陰影的換算公式 */ box-shadow: h-shadow v-shadow blur spread color; /* h-shadow:水平偏移量(正值向右,負值向左); v-shadow:垂直偏移量(正值向下,負值向上); blur:模糊半徑(默認值0); spread:陰影擴展半徑(正值表示擴大陰影區(qū)域,負值表示縮小); color:陰影顏色(默認值黑色)。 */
在CSS中,陰影的五個屬性需要分別計算,其中水平偏移量和垂直偏移量的單位為像素(px),模糊半徑和陰影擴展半徑的單位為px或者百分比(%),陰影顏色以16進制或rgb格式表示。
/* Photoshop中的換算公式 */ Effect >Stylize >Drop Shadow /* Distance:陰影距離; Spread:擴展程度; Size:陰影大小; Opacity:透明度; Angle:陰影角度; Color:陰影顏色。 */
在PS中,陰影同樣有五個屬性需要計算,其中距離和擴展程度的單位為像素(px),大小、透明度和角度均為百分比(%),顏色選擇時可以使用色板或者輸入16進制數(shù)表示。
總的來說,PS和CSS陰影的換算方法基本相同,只是單位略有不同。掌握這些換算方法,可以讓我們更便捷地進行網(wǎng)頁設(shè)計。