تابع skew() در CSS برای تغییر زاویه عناصر در محور X و Y استفاده میشود. با این تابع میتوان عناصر را به صورت مورب یا کج نمایش داد و افکتهای بصری جذاب و خلاقانه ایجاد کرد. برای یادگیری بیشتر و مثالهای عملی، به دوره آموزش CSS مراجعه کنید.
ساختار تابع skew
skew(x-angle, y-angle)- x-angle: زاویه مورب در محور افقی
- y-angle: زاویه مورب در محور عمودی (اختیاری)
مثال عملی تابع skew
.skew-box {
transform: skew(20deg, 10deg);
width: 200px;
height: 100px;
background-color: #3498db;
}جدول ویژگیها و توضیحات
| ویژگی | توضیح |
|---|---|
| x-angle | زاویه مورب در محور افقی |
| y-angle | زاویه مورب در محور عمودی (اختیاری) |
نکات مهم
- تابع skew() بخشی از ویژگی transform در CSS است.
- اگر y-angle داده نشود، برابر با 0 در نظر گرفته میشود.
- ترکیب skew با rotate و scale افکتهای بصری جذاب ایجاد میکند.
- برای ایجاد افکتهای تعاملی، میتوان از transition و animation همراه skew استفاده کرد.
ادامه آموزش
برای یادگیری کامل افکتهای transform و استفاده حرفهای از skew در CSS، حتماً دوره آموزش CSS را مشاهده کنید.
آموزش قبلی: آموزش تابع Rotate در CSS
آموزش بعدی: آموزش تابع Var در CSS
دیدگاه و پرسش