از تابع ()radial-gradient برای ساخت گرادینت (<gradient>) از نوع شعاعی استفاده می شود به این معنا که دو و یا چند رنگ به صورت شعاعی در هم محو می شوند. در این نوع گرادینت برخلاف <linear-gradient> که رنگ ها از یک سمت عنصر به سمت دیگر آن در کنار هم قرار می گیرند, رنگ ها […]
repeating-linear-gradient
از تابع ()repeating-linear-gradient برای ساخت گرادینت (<gradient>) از نوع خطی تکرار شونده استفاده می شود به این معنا که دو و یا چند رنگ به صورت خطی در یک راستای موافق در هم محو و به همان صورت در پس زمینه تکرار می شوند. این تابع دقیقا همان مقادیر تابع گرادینت خطی را می گیرد […]
linear-gradient
از تابع ()linear-gradient برای ساخت گرادینت (<gradient>) از نوع خطی استفاده می شود به این معنا که دو و یا چند رنگ به صورت خطی در یک راستای موافق در هم محو می شوند. تصویر زیر یک گردانیت خطی که تشکیل شده از رنگ زرد و بنفش است را نشان می دهد: تعریف گرادینت خطی […]
<gradient>
<gradient> یک نوع تصویر می باشد که از دو یا چند رنگ که به آرامی در هم محو می شوند تشکیل می شود. به عنوان مثال از آن برای سایه روشن کردن دکمه ها و یا عناصر دیگر استفاده می شود. در CSS گرادینت ها رنگ نیستند به همین دلیل نمی توان از آنها برای […]
box-shadow
از ویژگی box-shadow برای اضافه کردن سایه به یک عنصر یا باکس استفاده می شود. تمام عناصر در یک صفحه می توانند سایه بگیرند. box-shadow: [horizontal offset] [vertical offset] [blur radius] [spread radius] [color]; box-shadow: 2px 3px 10px 5px #f0f; اولین مقدار فاصله سایه با باکس را در راستای محور X مشخص می کند, که […]
text-shadow
از ویژگی text-shadow برای اضافه کردن سایه به متن استفاده می شود. می توان به متن یک عنصر چندین سایه اضافه کرد, که در این صورت اولین سایه در بالا و بقیه به ترتیب زیر آن قرار می گیرند. اگر متنی همراه با خط هم باشد (مثلا زیر خط دار باشد) سایه به آن خط […]
transition
transition یک ویژگی از نوع ویژگی های مختصر نویسی می باشد که با استفاده از آن می توان ویژگی های زیر را به صورت یکجا و مختصر در CSS تعریف کرد: transition-property transition-duration transition-timing-function transition-delay ترتیب نوشتن این ویژگی ها با استفاده از ویژگی transition مهم است و باید به ترتیب اشاره شده در بالا […]
transition-property
از ویژگی transition-property برای تعیین ویژگی هایی که قرار است transition بر روی آنها اعمال شود استفاده می شود. به عنوان مثال اگر بخواهیم transition فقط بر روی رنگ پس زمینه یک عنصر اعمال شود داریم: div { transition-property : background-color; } شما می توانید نام یک ویژگی و یا چند ویژگی که با استفاده […]
transition-duration
ویژگی transition-duration تعیین می کند که transition چه مدت زمانی به طول می انجامد. یعنی چه مدت طول می کشد تا مقدار ویژگی که transition بر روی آن اعمال می شود از مقدار قبلی به مقدار جدید برسد. واحد زمانی این ویژگی می تواند ثانیه و یا میلی ثانیه باشد و مقدار پیشفرض آن 0 […]
transition-timing-function
از ویژگی transition-timing-function برای تعیین سرعت تغییر ویژگی یک عنصر دارای transition در گذر زمان, استفاده می شود. این ویژگی اجازه می دهد تا فرایند تغییر یک ویژگی بتواند سرعت های مختلفی در دوره زمانیش داشته باشد. به بیان ساده تر عملیات transition می تواند با سرعت خیلی زیادی شروع شود و با یک سرعت […]