CSS3を使ってできる画像まわりのエフェクトやスタイリング18
CSS3を使った画像のエフェクトやスタイリングについて、思いつく限り一挙にまとめてみました。 たくさん画像を扱うサイトなどを作る際に、CSSでできる表現のカタログとして使ってもらえたらと思います。 ※ 2/24 「2. めくれた風」を書き忘れていたので追記しました 目次 1. シャドウ 2. めくれた風 3. トイカメラ風トンネル効果 4. カラー調整 5. 回転 6. 角丸 7. 楕円のフレーム 8. 円のフレーム 9. 三角形フレーム 10. 重なった風 11. ぼかし 12. フェード（シャドウ編） 13. フェード（グラデーション編） 14. 反射 15. リボン 16. 差し込んだ風 17. フレームだけを傾ける 18. 半透明フレーム まとめ ※ 実際の表示はこちらから確認できます。 ※ この記事で掲載しているCSSは、シンプルにするためにベンダープリフィックスを付けていません
Photoshopのレイヤーマスクを使ったブレンドテクニック / ウェブデザインライブラリー
シンボルをクリックしてレイヤーウインドウ（ウインドウ内に画像があります）からレイヤーマスクを開きます。 ブラシツールを選択して、背景色を「#000000」にしてから、次のようにオプションを設定します。 レイヤーウインドウに戻り、ブラシを使って画像を次のように作ります。 拡大画像を表示する 画像の感じがよくなるまで作業を続けます。 拡大画像を表示する 一番上（「右」レイヤー）のレイヤーマスクを作って、同じブラシを使って同様に作業します。すると次のようになります。 拡大画像を表示する レイヤー レイヤーマスクを使ってから、消しゴムツールで次のようにブラシを選択します。 一番下のレイヤーを選択して、消しゴムツールを使って画像の境界を消すと、画像の見栄えが良くなります。 拡大画像を表示する 一番上と一番下のレイヤーで作業を続けると、次のようになります。 この作業の後に、レイヤーウィンドウを選択しま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
YouTube人気急上昇
