آموزش کار با گرادینت ها در css

گرادینت ها

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

برتری استفاده از گرادینت ها نسبت به تصاویر در کنترلی است که بر روی ساخت آن ها داریم و همینطور عملکرد بهتر آنها در زمان ترسیمات مرورگر.

در دنیای CSS چهار نوع گرادینت وجود دارند که در این فصل با آنها آشنا خواهیم شد.

قبل از هرچیز نوع داده ای گرادینت را بررسی می کنیم:

gradient

سپس نحوه کار با گرادینت خطی را خواهیم آموخت:

linear-gradient

گرادینت خطی تکرار شونده را نیز ملاقات می کنیم 🙂 :

repeating-linear-gradient

آموختن گرادینت شعاعی مرحله بعد خواهد بود:

radial-gradient

و در نهایت کار با گرادینت شعاعی تکرار شونده را یاد می گیریم:

repeating-radial-gradient