夕暮ログ

C#やJavascript、最近はAndroidなんかも好きなtinqのブログ。「夕暮れログ」

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

影のぼやけと広がり

CSSで影をつけるをごらんになってからどうぞ。

CSSで影をつける場合、3つめの指定、「ぼかし具合」と、4つめの指定「広がり具合」の違いがよくわからなかったりします。 そこで、違いをはっきりさせておきます。
対応ブラウザでは下のボックスに影がついているはずです。
最初の数字がぼかし具合、次の数字が広がりです。

10px 0px
30px 0px
50px 0px
10px 10px
10px 30px
50px 30px
ぼかし具合を広めて行ったのが上です。数値を大きくすると、薄く、水彩絵の具を大量の水で延ばしたようになります。
それに対して、下の2つが広がり具合を大きくしたものです。ぼかし具合は変わりませんが、影の真っ黒な部分が広がっています。

右下のものは両方を大きめに設定したものです。これだけマージンを40pxと、大きめに設定しています。
見てわかるように、広い面積を大きくぼかしていることがわかります。
水彩絵の具で考えて、4つめの指定、影の広がりは絵の具の量、3つめの指定、ぼかし具合は水の量と考えるとわかりやすいかもしれません。
こちらもご覧ください。
ぼかしと広がりの比較
表でどのように変わるかを一覧表示できます。

コメント

ここをクリックしてコメントを投稿

非公開コメント

トラックバック

http://tinqwill.blog59.fc2.com/tb.php/15-80fc9b1c

« next  ホーム  prev »

プロフィール

tinq tinq(もしくはTinqWill)

Sky  For   Every 改装予定

プログラミングお勉強中の高校生。月一くらいは更新したい

最新記事

カテゴリ

月別アーカイブ

検索フォーム

最新コメント

リンク

最新トラックバック

FC2Ad

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。