آموزش کج کردن عکس به همراه کدر شدن

نظرات و پیشنهادات خود را در این انجمن مطرح نمائید
موضوع جدید ارسال پست
mohammadreza_bnd
کاربر نیمه فعال
کاربر نیمه فعال
پست: 58
تاریخ عضویت: چهارشنبه ۱۱ مرداد ۱۳۹۱, ۷:۱۳ ب.ظ
محل اقامت: Bandar Abbas
Has thanked: 11 times
Been thanked: 16 times
تماس:

آموزش کج کردن عکس به همراه کدر شدن

پست توسط mohammadreza_bnd »

[RIGHT]



سلام به همه دوستان امروز می خواستم یه آموزش بزارم راجب اینکه تصاویر پست رو چطوری میشه کج و کدر کرد
[/RIGHT][RIGHT]

خوب دوستان ابتدا میگم که سایت بیر دیزاین از این css استفاده میکند و من هم از اون سایت گرفتم .

این کد به درخواست یکی از دوستان عزیز در سایت قرار گرفته



تصویر

دانلود کد داده شده


وقتی که دانلود کردید یک عکس با آدرس :
https://www.greenskin.ir/themes/GreenSk ... s/logo.png
میباشد که شما میتونید اون عکس رو تغییر بدین .



موفق باشید .

[/RIGHT]


rezarafeie13
كاربر سایت
كاربر سایت
پست: 26
تاریخ عضویت: دوشنبه ۱۵ خرداد ۱۳۹۱, ۱:۲۲ ب.ظ
محل اقامت: اصفهان
Has thanked: 8 times
Been thanked: 4 times
تماس:

Re: آموزش کج کردن عکس به همراه کدر شدن

پست توسط rezarafeie13 »

سلام مرسی خیلی عالی بود فقط من نمی تونم توی بلاگفا برای مطالب سایت بزارمش.
قالب موزیک 11 (ایران موزیک) رو دارم میشه بگید کجا باید بزارم؟مرسی
mohammadreza_bnd
کاربر نیمه فعال
کاربر نیمه فعال
پست: 58
تاریخ عضویت: چهارشنبه ۱۱ مرداد ۱۳۹۱, ۷:۱۳ ب.ظ
محل اقامت: Bandar Abbas
Has thanked: 11 times
Been thanked: 16 times
تماس:

Re: آموزش کج کردن عکس به همراه کدر شدن

پست توسط mohammadreza_bnd »

rezarafeie13 نوشته شده:سلام مرسی خیلی عالی بود فقط من نمی تونم توی بلاگفا برای مطالب سایت بزارمش.
قالب موزیک 11 (ایران موزیک) رو دارم میشه بگید کجا باید بزارم؟مرسی

سلام .
وقتی که مطلب ارسال میکنید ، روی گزینه مشاهده کد HTML کلیک کنید و بعد کد رو در اونجا Paste کنید .
بعد آدرس عکس را تغییر دهید درست میشه .
به همین سادگی .
موفق باشید .
poriya
كاربر تازه وارد
كاربر تازه وارد
پست: 5
تاریخ عضویت: سه‌شنبه ۱۸ مهر ۱۳۹۱, ۳:۵۰ ب.ظ

Re: آموزش کج کردن عکس به همراه کدر شدن

پست توسط poriya »

سلام داداش من چرا الکی کارو سختش میکنی؟
کافیه اینو تو قالبت بزاری همه عکسا خود ب خود اینجور میشه

<style>img {border:1px solid #c0c0c0;max-width: 480px;margin:5px;padding:0px;-webkit-transition:all 0.5s ease-in;-moz-transition:all 0.5s ease-in;-o-transition:all 0.5s ease-in;transition:all 0.5s ease-in;-webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.9);-moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.9);box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.9);-webkit-transform: scale(0.800);-moz-transform: scale(0.800) ;-o-transform: scale(0.800) ;}
img:hover {max-width: 480px;margin-left:5px;-webkit-transform: scale(1);-moz-transform: scale(1) ;-o-transform: scale(1) ;}</style> تصویر تصویر تصویر
آواتار کاربر
black_Sky
مدير كل سایت
مدير كل سایت
پست: 95
تاریخ عضویت: دوشنبه ۱۲ تیر ۱۳۹۱, ۸:۳۲ ق.ظ
محل اقامت: TeHran
Has thanked: 28 times
Been thanked: 46 times
تماس:

Re: آموزش کج کردن عکس به همراه کدر شدن

پست توسط black_Sky »

Demo

کد: انتخاب همه


img {
    background-color: #EEEEEE;
    opacity: 1;
}
img:hover {
    opacity: 0.8;
} 
img:hover {
	   border: 1px solid #000000;
	   -webkit-transform: rotate(-12deg);
	   -moz-transform: rotate(-12deg);
	   -o-transform: rotate(-12deg);
	   }
img {
border: 1px solid #737373;
filter:alpha(opacity=80);
opacity:0.8;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-webkit-transition:all 0.3s ease-in;
-moz-transition:all 0.3s ease-in;
-o-transition:all 0.3s ease-in;
transition:all 0.3s ease-in;
background-color: #C3C3C3;
}
img:hover {
border: 1px solid #464646;
filter:alpha(opacity=100);
opacity:1.0;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
background-color: #ccc;
}


آواتار کاربر
teraffic
كاربر تازه وارد
كاربر تازه وارد
پست: 2
تاریخ عضویت: چهارشنبه ۲۸ تیر ۱۳۹۱, ۱۱:۵۶ ب.ظ
تماس:

Re: آموزش کج کردن عکس به همراه کدر شدن

پست توسط teraffic »

مدیر این کد که اینجا گذاشتی باید کجا قرار بدیم من متوجه نمیشم... تصویر
موضوع جدید ارسال پست