■画像ﾌｨﾙﾀｰ効果ＮＯ２
★ 画 像（フィルター効果）ＮＯ２ ★
９．画像を上下反転させよう
"filter:flipv()" を使います
<IMG src="http://画像アドレス" width="画像横幅" height="画像縦サイズ" style="filter:flipv()">
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
１０．画像を左右反転させよう
style="filter:FlipH()" を使います。
<IMG src="http://画像アドレス" width="画像横幅" height="画像たてｻｲｽﾞ" style="filter:FlipH()">
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
１１．画像を波状にしてみよう
style="filter:Wave()" を使います。
＊ style="filter:Wave()"
画像を波のようにゆがめます。
★ 下の（Ａ）～（Ｅ） の、基本タグです。
青表示のところを、変えてください。
<IMG src="http://画像アドレス" width="画像横幅" height="画像縦サイズ" style="filter:Wave()" >
...................................................................
（Ａ）
＊ style="filter:Wave(freq=3)" ＊ style="filter:Wave(freq=15)"
波の数を設定します。(任意の数字）
|
|
|---|---|
| filter:Wave(freq=3) | filter:Wave(freq=15) |
...............................................................
（Ｂ）
＊ style="filter:Wave(lightStrength=20)"
＊ style="filter:Wave(lightStrength=70)"
影の強さを設定します（範囲は弱0～100強）
|
|
|---|---|
| filter:Wave(lightStrength=30) | filter:Wave(lightStrength=70) |
.................................................................
（Ｃ）
＊ style="filter:Wave(phase=80)" ＊ style="filter:Wave(phase=10)"
波の開始のおおよそを設定します
（範囲は0～360ですが、おおよそだから0～90 位で設定してみてください）。
|
|
|---|---|
| filter:Wave(phase=10) | filter:Wave(phase=80) |
...................................................................
（Ｄ）
＊ style="filter:Wave(strength=5)"
＊ style="filter:Wave(strength=30)"
波の強さを設定します。
|
|
|---|---|
| filter:Wave(strength=5) | filter:Wave(strength30) |
.....................................................................
（Ｅ）
■ 波の数・陰の強さ・並みの強さ をあわせてみると・・
＊ style="filter:Wave(freq=2,lightStrength=10,strength=2)"
↓のような感じになります。
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
１１．画像をにじんだようにしてみよう
画像をにじませたような効果を出します。
style="filter:Blur()" を使います。
★ 下の（Ａ）～（Ｃ） の、基本タグです。
青表示のところを、変えてください
<IMG src="http://画像アドレス" width="画像横幅" height="画像縦サイズ" style="filter:Blur()" >
(A) にじませる角度を設定します。 ＊ style="filter:Blur(direction=45)"
(B) にじませの強さを設定します。 ＊ style="filter:Blur(strength=5)"
(C) にじませの強さを設定します。 ＊ style="filter:Blur(strength=80)"
★ 解りやすく、画像を大きくしています。
|
|
|
|---|---|---|
|
filter:Blur(direction=45)
|
filter:Blur(strength=5) | filter:Blur(strength=80) |
＊ style="filter:Blur(strength=100)"
にじませる数値を１００にしてみると・・・
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
１３．フィルターを合成してみよう
style="width:100% ; filter:Alpha(opacity=60) Shadow(color=#efefef,direction=100) FlipV()"
のように複数のフィルタータグを組み合わせて見ます。
＜半透明にして、波を付け、左右反転させる＞
filter:Alpha(opacity=60) Wave(freq=2,lightStrength=10,strength=2) FlipH()
<IMG src="http://画像アドレス" width="画像横幅" height="画像縦ｻｲｽﾞ" style="width:50% ;filter:Alpha(opacity=60) Wave(freq=2,lightStrength=10,strength=2) FlipH()">
フィルター効果ＮＯ１へ 飾り文字・陰へ
ジャンル別一覧
人気のクチコミテーマ
-
-
- しんくぱっど
- 【続】X1 Carbonの電源ボタンが機能…
- (2025-10-19 19:42:00)
-
-
-
- 新製品発売情報・予約情報
- 喜怒哀楽ｂｙ増田貴久
- (2025-02-14 15:21:13)
-
-
-
- パソコンニュース＆情報
- ブラウザChromeの新機能 "ページを音…
- (2025-11-03 10:02:13)
-
© Rakuten Group, Inc.
