フィルタに関するCSS
■α合成
■例:α合成(style=0,opacity=50)
■例:α合成(style=1,opacity=100)
■例:α合成(style=2,opacity=100)
■例:α合成(style=3,opacity=100)
|
■CSS
タグ{position:absolute;
filter:Alpha(パラメータ=値);}
■HTML
<タグ style="position:absolute;
filter:Alpha(パラメータ=値)">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
startX
| 適用範囲の開始X座標
| |
startY
| 適用範囲の開始Y座標
| |
finishX
| 適用範囲の終了X座標
| |
finishY
| 適用範囲の終了Y座標
| |
opacity
| 開始地点の透明度(0〜100)
| |
finishOpacity
| 終了地点の透明度(0〜100)
| |
style
| 0:均一、1:線状、2:円形、3:四角
| |
enabled
| true:有効、false:無効
| |
■ぼかし
■例:ぼかし(direction=45,add=0)
■例:ぼかし(direction=135)
■例:ぼかし(direction=225)
■例:ぼかし(direction=315)
|
■CSS
タグ{position:absolute;
filter:Blur(パラメータ=値);}
■HTML
<タグ style="position:absolute;
filter:Blur(パラメータ=値)">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
add
| 0:元イメージを合成しない、1:合成する
| |
direction
| 方向(0〜360)45度単位
| |
enabled
| true:有効、false:無効
| |
■シャドー
■例:影(direction=135)
■例:影(color=red)
|
■CSS
タグ{position:absolute;
filter:Shadow(パラメータ=値);}
■HTML
<タグ style="position:absolute;
filter:Shadow(パラメータ=値)">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
color
| 影の色を指定
| |
direction
| 方向(0〜360)45度単位
| |
enabled
| true:有効、false:無効
| |
■ドロップシャドー
■例:影(color=red)
■例:影(offX=10,offY=10)
■例:影(positive=false)
|
■CSS
タグ{position:absolute;
filter:Dropshadow(パラメータ=値);}
■HTML
<タグ style="position:absolute;
filter:Dropshadow(パラメータ=値)">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
color
| 影の色を指定
| |
offX
| オフセットX座標
| |
offY
| オフセットY座標
| |
positive
| true:通常、false:カットアウト
| |
enabled
| true:有効、false:無効
| |
■発光効果
■例:発光(color=yellow)
■例:発光(strength=15)
|
■CSS
タグ{position:absolute;
filter:Glow(パラメータ=値);}
■HTML
<タグ style="position:absolute;
filter:Glow(パラメータ=値)">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
color
| 発光する色を指定
| |
strength
| 発光強度を指定
| |
enabled
| true:有効、false:無効
| |
■クロマキー
■例:クロマキー(color=black)
※クロマキーは、特定色を領域から消します。
|
■CSS
タグ{position:absolute;
filter:Chroma(パラメータ=値);}
■HTML
<タグ style="position:absolute;
filter:Chroma(パラメータ=値)">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
color
| 消す色を指定
| |
enabled
| true:有効、false:無効
| |
■マスク
■例:カラーマスク(color=red)
※カラーマスクは、指定色の領域から色を消します。
|
■CSS
タグ{position:absolute;
filter:Mask(パラメータ=値);}
■HTML
<タグ style="position:absolute;
filter:Chroma(パラメータ=値)">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
color
| 文字の背景色を指定
| |
enabled
| true:有効、false:無効
| |
■左右反転
■例:左右反転
|
■CSS
タグ{position:absolute;
filter:FlipH();}
■HTML
<タグ style="position:absolute;
filter:FlipH()">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
enabled
| true:有効、false:無効
| |
■上下反転
■例:上下反転
|
■CSS
タグ{position:absolute;
filter:FlipV();}
■HTML
<タグ style="position:absolute;
filter:FlipV()">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
enabled
| true:有効、false:無効
| |
■色反転
■例:色反転
|
■CSS
タグ{position:absolute;
filter:Invert();}
■HTML
<タグ style="position:absolute;
filter:Invert()">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
enabled
| true:有効、false:無効
| |
■グレースケール
■例:グレースケール
|
■CSS
タグ{position:absolute;
filter:Gray();}
■HTML
<タグ style="position:absolute;
filter:Gray()">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
enabled
| true:有効、false:無効
| |
■X線効果
■例:X線効果
|
■CSS
タグ{position:absolute;
filter:Xray();}
■HTML
<タグ style="position:absolute;
filter:Xray()">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
enabled
| true:有効、false:無効
| |
■波形効果
■例(strength=5,lightstrength=5)
■例:波形効果(add=1)

■例:波形効果(freq=2)

■例:波形効果(phase=2)

|
■CSS
タグ{position:absolute;
filter:Wave(パラメータ=値);}
■HTML
<タグ style="position:absolute;
filter:Wave(パラメータ=値)">〜</タグ>
■パラメータ
パラメータ名
| 値
| |
add
| 0:元イメージを合成しない、1:合成する
| |
freq
| 波数(0〜)
| |
strength
| 強度(0〜)
| |
lightstrength
| 強度(0〜100)
| |
phase
| 波形開始位相(0〜100)
| |
enabled
| true:有効、false:無効
| |
Presented by
HTML辞典