html 測試 上入 下出

html 測試 左右 各一 測試

html 測試 單入 單出

html 測試 左入右出

class="ot"









尾部連結 hbbb(xx)

2020年4月1日 星期三

CSS Filters濾鏡效果

CSS Filters濾鏡效果

CSS Filters濾鏡效果有點像是photoshop的濾鏡功能。透過CSS Filters濾鏡效果我們可以對網頁元素進行渲染。一般情況下、當網頁元素包含子元素時、CSS Filters 會同時對子元素進行渲染。
 

blur 模糊 blur(0px) 0px 到100px,的百分比控制
sepia 懷舊 sepia(0) 0 or 1,1為元素轉換成黑白影像
invert 負片 invert(0) 0 or 1,1為元素轉換成負片影像
opacity 透明 opacity(1) 0 to 1,step 0.1 0為元素轉換成全透明影像
contrast 對比 contrast(0) 0 to 10, 10為明亮和陰暗部份的大差距
saturate飽和 saturate(0) 0 to 10, 10為元素轉換成最大飽和度
brightness 亮度 brightness(0) 0 to 10, 10為元素轉換成最大亮度度
grayscale 灰階 grayscale(0) 0 to 10, 10為元素轉換成最大灰階度
hue-rotate 色相旋轉 hue-rotate(0deg) 0deg – 360deg 旋轉色相環
drop-shadow 下拉陰影 drop-shadow(30px 10px 4px #4444dd) x偏移量 | y偏移量 | 陰影模糊半徑 | 陰影顏色
00
#CSS Filters濾鏡效果 #html Filters濾鏡效果 #blur 模糊 #sepia 懷舊 #invert 負片 #opacity 透明 #contrast 對比 #saturate飽和 #brightness 亮度 #grayscale 灰階 #hue-rotate 色相旋轉 #drop-shadow 下拉陰影

沒有留言:

張貼留言