جهت ورود به تالار گفتمان سایت کلیک کنید

هاست هاست

پست ثابت تبلیغاتی

گروه نرم افزاری قیاس با بیش از 20 سال سابقه فعالیت توانسته است تمامی نیازهای شرکتها، فروشگاهها و اصناف گوناگون را در سری نرم افزارهای مالی شرکتی و فروشگاهی خود پوشش دهد.

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

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

برای ورود به سایت کلیک کنید


آموزش کامل استفاده از خاصیت فیلتر در Css

یکی از خاصیت های بسیار حرفه ای و زیبای CSS , خاصیت filter میباشد . این خاصیت با مقادیری که دارد , میتوانید عکس مورد نظر خود را به سیاه سفید , تار , سایه و … تبدیل کنید .

برای این ساعت از سایت اسکریپت دات کام قصد دارم به آموزش این توابع از css بپردازم که امیدوارم مورد پسند کاربران گرامی قرار گیرد .

یکی از معایب filter ها , عدم پشتیبانی تمامی مرورگرها از این خاصیت می باشد . این خاصیت را در حال حاضر مرورگر های Google Chrome و Opera پشتیبانی میکنند و مرورگر های FireFox , Safari و IE از این خاصیت پشتیبانی نمیکنند .

طبیعتا وب سایتی مورد تایید است که در تمامی مرورگرها یکسان باشد . یعنی از خاصیت هایی استفاده شود تا تمامی مرورگرها قابلیت پشتیبانی از آنها را داشته باشند . ولی این مورد , به معنی عدم استفاده از Filter ها نمی باشد . چون در حال حاضر , 60% مردم دنیا از گوگل کروم استفاده میکنند .

آموزش کامل استفاده از خاصیت فیلتر در Css

و اما آموزش : 

1 – در ابتدا باید توجه داشته باشید که باید در css , هم خاصیت Filter را بنویسید و هم با پیشوند -webkit-

( Function  به معنی تابع می باشد که در ادامه آموزش خواهم داد )

2 – طبیعتا برای همه ی عکس های یک وب سایت , دادن این توابع خیلی عقلانی نیست و باید به صورت سفارشی سازی , فقط بعضی از عکس ها از این توابع تبعیت کنند .

میتوانید از کلاس های html استفاده کنید .  به عنوان مثال :  

تابع خاصیت GrayScale ( سیاه و سفید ) :  ( نکته : مقدایر بین %0 تا  %100 را میگیرد )

 

تابع خاصیت sepia ( عکس های قدیمی ) :  ( نکته : مقدایر بین %0 تا %100 را میگیرد )

 

تابع خاصیت saturate ( غلظت رنگ ها ) :  ( نکته : مقدایر بین %0 تا  %∞ را میگیرد )

 تابع خاصیت blur ( تاری و شفافیت عکس ) :  ( نکته : مقدایر بین 0px تا 100px را میگیرد )

تابع خاصیت hue-rotate ( تغییر رنگ بر اساس دایره رنگی ) :  ( نکته : مقدایر بین 0deg تا 360deg را میگیرد )

 تابع خاصیت invert ( تبدیل رنگ ها به مکمل رنگشان ) :  ( نکته : مقدایر بین %0 تا %100 را میگیرد )

 تابع خاصیت contrast ( کنتراست ) :  ( نکته : مقدایر بین %0 تا  %∞ را میگیرد )

 تابع خاصیت brightness ( تاریکی و روشنایی ) :  ( نکته : مقدایر بین %0 تا  %∞ را میگیرد )

 تابع خاصیت drop-shadow ( سایه ) :

توجه : عدد اول جابجایی سایه در جهت محور x , عدد دوم جابجایی سایه در جهت محور y , عدد سوم مقدار سایه و در آخر رنگ سایه  . ضمنا عدد ای اول و دوم میتوانند منفی هم باشند .

دموی تمامی توابع

پخش اختصاصی

گرداوری : وحید مجیدی

فایل آماده آموزش :

جهت تبادل گفتگو و حل مشکلات در باره این موضوع , کلیک کنید

9 پاسخ به “آموزش کامل استفاده از خاصیت فیلتر در Css”

  1. شاهین گفت:

    مرسی داش وحید
    لطفا آموزش درباره افکت هایی که برای عکس می تونیم به کار ببریم بیشتر بزار
    چاکریم

  2. شاهین گفت:

    داش وحید دمت گرم خیلی به درد خورد فقط تو مرورگر واترفاکس و اینترنت اکسپلورر نشونشون نمیده، اگه از مرورگره که هیچی ولی اگه میشه واسه اونام درستش کرد لطفا بگو. مرسی

    • وحید مجیدی گفت:

      شاهین جان همون طور که توی پست نوشتم این کد ها فقط برای کروم هست و بقیه ساپورت نمیکنن به هیچ عنوان

  3. بهینه سازی وردپرس گفت:

    فوق العاده بود

    خیلی ممنون بابت وب سایت خوبتون

  4. محمد فرجی گفت:

    عالـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــی

    وحید جون مثه همیـــــــــــــــــــــــــــــــــــــــــــشه
    تکــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــی

  5. وحید مجیدی گفت:

    قربان شما وظیفس …

  6. ارم سرور گفت:

    ممنون

  7. dashesi_lamer گفت:

    نایس

پاسخ دهید

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