記入例(影1)
<div style="filter: shadow(color=#000000,direction=135); width: 70; height: 40"><h1>影1</h1></div>
※colorで影の色を指定、directionで影の方向を360度の範囲で指定します。
表示結果
影1
記入例(影2)
<div style="filter: dropshadow(color=#440000,offx=5,offy=5); width: 70; height: 40"><h1>影2</h1></div>
※colorで影の色を指定、offxとoffyでオフセット量を指定します。
表示結果
影2
記入例(発光効果)
<div style="filter: Glow(color=#ff0000,strength=2); width: 140; height: 40"><h1>発光効果</h1></div>
※colorで色を指定、strengthで発光強度を指定します。
表示結果
発光効果
記入例(高速移動効果)
<div style="filter: blur(add=0, direction=90,strength=7); width: 210; height: 40"><h1>高速移動効果</h1></div>
※addを0以外の値にすると元のフォントが追加表示されます。directionでぶれの方向、strengthで強度を指定します。
表示結果
高速移動効果
記入例(ゆがみ効果)
<div style="filter: wave(add=0, freq=2, lightstrength=20, phase=0, strength=4); width: 210; height: 40"><h1>ゆがみ効果</h1></div>
※addを0以外の値にするとゆがんでいない元のフォントが追加表示されます。freqはゆがみの波の数、lightstrengthはゆがみを照らす照明効果の強度、phaseはゆがみの開始角度をパーセントで指定(100で360度)、strengthでゆがみ強度を指定します。
表示結果
ゆがみ効果
記入例(透過処理)
<div style="filter: alpha(opacity=30); color: #FF0000; width: 400; height: 40"><h3>フォントは上と同じ色を指定していますが透過処理により背景が透けています。</h3></div>
※opacityで透明度(0で透明)を指定します。
表示結果
フォントは赤を指定していますが透過処理により背景が透けています。
|