مشکل بی کیفیت شدن عکس در سایز های مختلف

اگر شما در حال توسعه وب سایت ریسپانسیو هستید به احتمال زیاد با مشکل بی کیفیت شدن عکس مواجه شده اید . این مورد در سایز موبایل و بیشتر در مرورگر فایرفاکس رخ می دهد .

یکی از نمونه های که با مشکل مواجه شده

مشکل بی کیفیت شدن عکس

http://codepen.io/robinrendle/pen/EaOJeq

برای این کار باید از خصوصیت image-rendering استفاده کنید .

img {
  image-rendering: auto;
  image-rendering: crisp-edges;
 image-rendering: pixelated;
}

.و در بعضی مواقع با همچیین ترفندی میتونید از تغییر کیفیت عکس جلوگیری کنید

.image-scale-hack {
    transform: rotate( .0001deg );
}

 

دریافت مشاوره حرفه ای و رایگان از متخصصین آکادمی برنامه نویسان مشهد

شما این فرصت را دارید، با تکمیل فرم زیر، قبل از انتخاب دوره آموزشی مناسب خود از مشاوره حرفه ای و رایگان متخصصین کلاس برنامه نویسی در مشهد استفاده کنید
  • این فیلد برای اعتبار سنجی است و باید بدون تغییر باقی بماند .

همچنین ببینید

آموزش ux/ui

۱۰ نکته ی مهم که در طراحی UX/UI باید بدانید

طراحی UX/UI یکی از بهترین فرصت های شغلی می باشد که هر روز به اهمیت …

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *