- درباره هنر تذهیب و ویژگی های آثار تذهیب بخوانید
- مینای نقاشی جیست و چه محصولاتی را می توان نقاشی کرد؟
- لیست قیمت و خرید انواع فریزر صندوقی
- آموزش کامپیوتر به کودکان
- کوچیک شدن شکم و پهلو بدون عذاب و دردسر
- عفونت واژن در بارداری
- سطح زبان برای مهاجرت به ترکیه
- دندانپزشکی زیبایی و ارتودنسی
- کودک 3 تا 7 سال
- نورافشانی مجالس
انجمن
آخرین مطالب
امکانات وب
ایجاد بازتاب آینه ای با استفاده از CSS و Reflection.js
آموزش طراحی سایت
![[عکس: %D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D8%A8%D8...ion.js.jpg]](http://magbot.ir//%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D8%A8%D8%A7%D8%B2%D8%AA%D8%A7%D8%A8-%D8%A7%D8%AB%D8%B1-%D9%82%D8%A7%D8%A8%D9%84-%D8%AA%D9%88%D8%AC%D9%87%DB%8C-%D8%A8%D8%A7-%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87-%D8%A7%D8%B2-CSS-%D9%88-Reflection.js/%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D8%A8%D8%A7%D8%B2%D8%AA%D8%A7%D8%A8-%D8%A7%D8%AB%D8%B1-%D9%82%D8%A7%D8%A8%D9%84-%D8%AA%D9%88%D8%AC%D9%87%DB%8C-%D8%A8%D8%A7-%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87-%D8%A7%D8%B2-CSS-%D9%88-Reflection.js.jpg)
روش شگفت انگیز که می توانید با طراحی وب مدرن امروز کمک کند یک اثر بازتاب تصویر است.
با این حال، ایجاد یک اثر انعکاسی تصویر با استفاده از CSS برای سایت شما می تواند زمان زیادی صرف کند، هنگامی که شما نیاز به تغییر تصاویر در سایت خود دارد ، شما همچنین نیاز به تغییر برخی از بخش های CSS خود را را دارید. یکی دیگر از مشکلات که شما ممکن است با آن مواجه شوید این است که در تمام مرورگرها کار نکند.
یک ابزار جاوا اسکریپت جدید به نام Reflection.js برای جی کوئری و MooTools موجود است. باعث می شود ایجاد انعکاسی برای سایت شما بسیار ساده تر و سریعتر باشد.
خوب شروع کنید.
نسخه CSS3
برای HTML ما، ما به سادگی یک تصویر اضافه می کنیم و آن را بر روی یک عنصر HTML5 قرار می دهیم.
![[عکس: rocket.png]](http://magbot.ir/%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%d8%a8%d8%a7%d8%b2%d8%aa%d8%a7%d8%a8-%d8%a7%d8%ab%d8%b1-%d9%82%d8%a7%d8%a8%d9%84-%d8%aa%d9%88%d8%ac%d9%87%db%8c-%d8%a8%d8%a7-%d8%a7%d8%b3%d8%aa%d9%81%d8%a7%d8%af%d9%87-%d8%a7%d8%b2-CSS-%d9%88-Reflection.js/img/rocket.png)
برای CSS ما قصد داریم به موارد زیر عمل کنیم:
1. با استفاده از مقدار خودکار، حاشیه 60px را در بالای صفحه قرار دهید و آن را روی صفحه قرار دهید.
2. بعد، از منوی -webkit-box-reflect CSS برای نشان دادن تصویر به پایین استفاده کنید.
3. سپس تصویر را با استفاده از -webkit-gradient ماسک می کنیم تا تصویر را در پایین پایین بیاوریم و فقط یک قسمت یا کمتر از تصویر را نمایش می دهیم.
با استفاده از کدهای بالا، شما یک تصویر بازتابی شبیه تصویر زیر دارید.
مقالات مرتبط
![[عکس: %DA%86%DA%AF%D9%88%D9%86%DA%AF%DB%8C-%D8...toshop.jpg]](http://magbot.ir//%DA%86%DA%AF%D9%88%D9%86%DA%AF%DB%8C-%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D8%A2%DB%8C%DA%A9%D9%88%D9%86-%D9%86%D8%A7%D9%88%D8%A8%D8%B1%DB%8C-%D8%AA%D8%AE%D8%AA-%D8%AF%D8%B1-Adobe-Photoshop/%DA%86%DA%AF%D9%88%D9%86%DA%AF%DB%8C-%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D8%A2%DB%8C%DA%A9%D9%88%D9%86-%D9%86%D8%A7%D9%88%D8%A8%D8%B1%DB%8C-%D8%AA%D8%AE%D8%AA-%D8%AF%D8%B1-Adobe-Photoshop.jpg)
چگونگی ایجاد آیکون ناوبری تخت در Adobe Photoshop
![[عکس: %DA%86%DA%AF%D9%88%D9%86%D9%87-%DB%8C%DA...%D9%85.jpg]](http://magbot.ir//%DA%86%DA%AF%D9%88%D9%86%D9%87-%DB%8C%DA%A9-%D9%86%D9%88%D8%A7%D8%B1-%D9%BE%DB%8C%D8%B4%D8%B1%D9%81%D8%AA-%D8%AC%D8%A7%D9%88%D8%A7%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA-%D8%B1%D8%A7-%D8%A8%D8%A7-Pace.js-%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%DA%A9%D9%86%DB%8C%D9%85/%DA%86%DA%AF%D9%88%D9%86%D9%87-%DB%8C%DA%A9-%D9%86%D9%88%D8%A7%D8%B1-%D9%BE%DB%8C%D8%B4%D8%B1%D9%81%D8%AA-%D8%AC%D8%A7%D9%88%D8%A7%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA-%D8%B1%D8%A7-%D8%A8%D8%A7-Pace.js-%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%DA%A9%D9%86%DB%8C%D9%85.jpg)
چگونه یک نوار پیشرفت جاوااسکریپت را با Pace.js ایجاد کنیم
چگونه یک نوار پیشرفت جاوااسکریپت را با Pace.js ایجاد کنیم انجمن...
آموزش طراحی سایت
روش شگفت انگیز که می توانید با طراحی وب مدرن امروز کمک کند یک اثر بازتاب تصویر است.
با این حال، ایجاد یک اثر انعکاسی تصویر با استفاده از CSS برای سایت شما می تواند زمان زیادی صرف کند، هنگامی که شما نیاز به تغییر تصاویر در سایت خود دارد ، شما همچنین نیاز به تغییر برخی از بخش های CSS خود را را دارید. یکی دیگر از مشکلات که شما ممکن است با آن مواجه شوید این است که در تمام مرورگرها کار نکند.
یک ابزار جاوا اسکریپت جدید به نام Reflection.js برای جی کوئری و MooTools موجود است. باعث می شود ایجاد انعکاسی برای سایت شما بسیار ساده تر و سریعتر باشد.
خوب شروع کنید.
نسخه CSS3
برای HTML ما، ما به سادگی یک تصویر اضافه می کنیم و آن را بر روی یک عنصر HTML5 قرار می دهیم.
برای CSS ما قصد داریم به موارد زیر عمل کنیم:
1. با استفاده از مقدار خودکار، حاشیه 60px را در بالای صفحه قرار دهید و آن را روی صفحه قرار دهید.
2. بعد، از منوی -webkit-box-reflect CSS برای نشان دادن تصویر به پایین استفاده کنید.
3. سپس تصویر را با استفاده از -webkit-gradient ماسک می کنیم تا تصویر را در پایین پایین بیاوریم و فقط یک قسمت یا کمتر از تصویر را نمایش می دهیم.
با استفاده از کدهای بالا، شما یک تصویر بازتابی شبیه تصویر زیر دارید.
چگونگی ایجاد آیکون ناوبری تخت در Adobe Photoshop
چگونه یک نوار پیشرفت جاوااسکریپت را با Pace.js ایجاد کنیم
چگونه یک نوار پیشرفت جاوااسکریپت را با Pace.js ایجاد کنیم انجمن...
ما را در سایت انجمن دنبال میکنید
برچسب: نویسنده: نیلوفر ابی بازدید: 243