FC2ブログ

shigexの日記と興味のあることを世界中の人々へ発信します。

  1. ホーム
  2. パソコン
  3. CSS3で画像を写真風装飾(ドロップシャドウ・回転)

 « 次の記事 Panasonic 首専用治療器 EW-NA11 ネックリフレ  携帯電話からfc2ブログに記事を投稿する方法 前の記事 »

CSS3で画像を写真風装飾(ドロップシャドウ・回転)

shigexのつぶやきshigexworks

CSS3のみで画像を写真風装飾してみました。paddingとborderで枠を付け、transformとtransform-origin で回転させ、box-shadowでドロップシャドウを付けます。 http://goo.gl/UFZGH
01-15 18:31

CSS3で画像を写真風装飾(ドロップシャドウ・回転)

Internet Explorer(6・7・8)には対応していません。

静岡ホビーフェア ガンダムラブ at 遠州灘海岸浜名湖ガーデンパーク  コスモス

img {

padding: 8px;
background-color: #ffffff;
border: 1px solid #dddddd;

-moz-box-shadow: 10px 10px 10px #aaaaaa;
-webkit-box-shadow: 10px 10px 10px #aaaaaa;
box-shadow: 10px 10px 10px #aaaaaa;

-moz-transform: rotate(30deg);
-webkit-transform: rotate(30deg);
-o-transform: rotate(30deg);
transform: rotate(30deg);

-moz-transform-origin: 30% 95%;
-webkit-transform-origin: 30% 95%;
-o-transform-origin: 30% 95%;
transform-origin: 30% 95%;

}

ブックマーク登録ボタンはてブ数 ブックマーク登録ボタン ブックマーク登録ボタン ブックマーク登録ボタン ブックマーク登録ボタン

この記事を見た人はこんな記事も読んでいます

Loading...
ローディング

トラックバックURL

トラックバック

-

管理人の承認後に表示されます

コメント

I wanted to thank you for this very good read!!
I absolutely loved every bit of it. I've got you
book-marked to check out new things you post…

コメントの投稿


秘密にする
 

Category

Tag

雑学 ウェブ 健康 浜松市 家電 気象 障害者 テレビ ファッション ライフハック 自然 スイーツ カスタマイズ ハードウェア スポーツ 福祉 HTML ブラウザ グルメ ペット アクセシビリティ CSS ソフトウェア 

Entry

Comment

Trackback

Link

Extend

あわせて読みたいブログパーツ
SEO Stats powered by SEO-Stats.com
FC2ランキング

Sponsored link