zoukankan      html  css  js  c++  java
  • DIV特效汇

    css控制DIV透明度

    在CSS样式中,提供了filter(滤镜效果),它可以对文字、图片、表格等确定范围的HTML标记设置滤镜效果。例: :^ L u S9H3n s
    黑白照片"S H:m A Y m S
    filter: gray;(H%U e*? l8F
    2x h(} ? s v V
    5x'I#v)r u8B
    X光照片 ] D c @/N
    filter: Xray;
    r u6u"P _ } v X &y ^1}!n R
    风动模糊
    T N Q$M4`&y filter: blur(add=true,direction=45,strength=30);
    d$T#}3J O ?'F$l j5N 8`"n C6e9m
    正弦波纹/g H a Y w f X A:i e5w
    filter: Wave(Add=0, Freq=60, LightStrength=1, Phase=0, Strength=3);
    o B2h S h&V i
    *` ~ T C k(k I | r
    /J6E u7?'z1e i x 半透明效果;n r S'k+w2}$g
    filter: Alpha(Opacity=50); .V5C9n ~ n w D |3q X h
    线型透明 H e9f8N L/U D%W b U
    filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=140); {5L"e4T5o m ` H
    放射透明
    :O,F"R0T"r b x(b,p%t filter: Alpha(Opacity=10, FinishOpacity=100, Style=2, StartX=30, StartY=30, FinishX=200, FinishY=200); p's N.@,E'}!O0q:i F
    白色透明
    s8n N | a x x filter: Chroma(Color=#FFFFFF);
    !r;l$~ o e0C 2t Y%B `1{*}
    降低色彩 T f D l t:W ?
    filter: grays;
    /w f O*T1L s h 底片效果
    H ^ z+L E @ L filter: invert; O:?&j5m T*| Y
    左右翻转$v9C3I B*O
    filter: fliph; L F a f5c s
    垂直翻转 $v!p+o |5h F4O q*h
    filter: flipv;
    K R1W l y J
    7M N0v a G K | F j4_ 投影效果
    | {9\-t f,x filter:progid:dXImageTransform.Microsoft.DropShadow(color=#cccccc,offX=5,offY=5,positives=true);
    )i9Q7V;A J8w 马赛克
    z y @ _ t @ filter:progid:dXImageTransform.Microsoft.Pixelate(maxsquare=3); x(w { r O s1} s
    发光效果 R Y I i B E @
    filter:progid:dXImageTransform.Microsoft.Glow(color=#cccccc,Strength=5);
    Y8c m1e V8Y#b![ 柔边效果
    z l-H A*R ]!A filter:alpha(opacity=100, finishOpacity=0,style=2
    <DIV style="OVERFLOW-X: auto;OVERFLOW: auto;200;height:300">...</Div>
    大部分转载 小部分自写
  • 相关阅读:
    算法设计与分析 5.1 合并果子
    算法设计与分析 4.5 洪尼玛与神秘信封
    算法设计与分析 4.4 洪尼玛与魔法卡
    算法设计与分析 4.3 洪尼玛与芒果篮
    算法设计与分析 4.2 洪尼玛与网络攻防战
    算法设计与分析 4.1 洪尼玛与巧克力工厂
    算法设计与分析 3.5 大尾巴狼
    算法设计与分析 3.4 小鲨鱼
    算法设计与分析 3.3 眯眯眼天使
    算法设计与分析 3.2 小绵羊
  • 原文地址:https://www.cnblogs.com/8586/p/1707645.html
Copyright © 2011-2022 走看看