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

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

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

スポンサーサイト

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

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

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

トラックバック

-

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

コメント

コメントの投稿


秘密にする
 

Sponsored link

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