ホームページ > ウェブフロントエンド > CSSチュートリアル > CSSフィルターリファレンス_CSS/HTML

CSSフィルターリファレンス_CSS/HTML

WBOY
リリース: 2016-05-16 12:11:23
オリジナル
1342 人が閲覧しました

構文: STYLE="filter:filtername(fparameter1, fparameter2...)"
(Filtername はフィルターの名前、fparameter1、fparameter2 などはフィルターのパラメーターです)
スクリプト構文: HTMLElement.filters .filterName.fParameter=値;

フィルターの説明:

Alpha: 透明度を設定します

Blur: 高速移動効果、つまりぼかし効果を作成します
Chroma: 特殊な色を透明にします
DropShadow: オブジェクトの固定影を作成します
FlipH: 水平の鏡像を作成します
FlipV: 垂直の鏡像を作成します
グロー: 近くのオブジェクトの外側に光を追加
グレー: 画像をグレースケール
反転: 色を反転
ライト: オブジェクト上に光源を作成します
マスク: オブジェクト上に透明なマスクを作成します
シャドウ: オフセット固定シャドウを作成します
波: リップル効果
Xray: オブジェクトをそのように見せますX線で照らされています

1.フィルター:アルファ

構文:STYLE="filter:Alpha(Opacity=opacity, FinishOpacity=finishopacity, Style=style, StartX=startX, StartY=startY, FinishX=finishX, FinishY=finishY)"
説明:
不透明度: 0 ~ 100 の範囲の開始値。0 は透明、100 は元の画像です。
FinishOpacity: 目標値。
スタイル: 1 または 2 または 3
StartX: 任意の値
StartY: 任意の値
例: filter:Alpha(Opacity="0",FinishOpacity="75",Style="2" )

2. フィルター: ブラー

構文: STYLE="filter:Blur(Add = 追加、Direction = 方向、Strength = 強度)"
説明:
追加: 通常は 1 または 0 。
方向: 角度、0 ~ 315 度、ステップ サイズは 45 度です。
強度: 効果の成長の値、通常は 5。
例: filter:Blur(Add="1",Direction="45",Strength="5")

3. フィルター: Chroma

構文: STYLE="filter:Chroma(Color = color)"
説明: color: #rrggbb 形式、任意。
例: filter:Chroma(Color="#FFFFFF")

4. フィルター: DropShadow

構文: STYLE="filter:DropShadow(Color=color, OffX=offX, OffY=offY, Positive=positive)"
説明: カラー: #rrggbb 形式、任意。
Offx: X 軸の偏差値。
オフ: Y 軸偏差値。
正: 1 または 0。
例: filter:DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1")

5. フィルター: FlipH

構文: STYLE="filter:FlipH"
例: filter:FlipH

6. フィルター: FlipV

構文: STYLE="filter:FlipV"
例: filter:FlipV

7. フィルター: グロー

構文: STYLE="filter:Glow(Color=color, Strength=strength)"
説明:
カラー: グローの色。
強度: 強度 (0-100)
例: filter:Glow(Color="#6699CC",Strength="5")

8. フィルター: グレー

構文: STYLE="filter:Gray"
例: filter:Gray

9. フィルター: 反転

構文: STYLE="filter:Invert"
例: filter:Invert

10. フィルター: マスク

構文: STYLE="filter:Mask(Color=color)"
例: filter:Mask (Color="#FFFFE0")

11. フィルター: シャドウ

構文: filter:Shadow(Color=color, Direction=direction)
説明:
カラー: #rrggbb 形式。
方向: 角度、0 ~ 315 度、ステップ サイズは 45 度です。
例: filter:Shadow (Color="#6699CC", Direction="135")

12. フィルター: wave

構文: filter: Wave(Add=add, Freq=freq, LightStrength=strength, Phase=phase, Strength=strength)
説明:
Add: 通常 1、または0。
Freq: 変形値。
LightStrength: 変形率。
位相: 角度変形の割合。
強度: 変形強度。
例: フィルター: wave(Add="0", Phase="4", Freq="5", LightStrength="5", Strength="2")

13. フィルター: Xray

構文: STYLE="filter:Xray"
例: filter:Xray

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート