چرخش (Rotation) یک عنصر به صورت کج شدن (Skew) نسبت به محور Y ، به یک اندازه مشخص (بر حسب درجه (Degree))، با مشخصه های transform:skewY و ms-transform:skewY- و webkit-transform:skewY- ، در CSS

فرض کنید که یک عنصر (Element) در صفحه داریم و می خواهیم نمایش آن در صفحه، به همراه 30 درجه (Degree) چرخش (Rotation) به صورت کج شدن (Skew) نسبت به محور Y باشد (دقت شود که چرخش به صورت انیمیشن نیست و از ابتدا عنصر را با آن میزان چرخش مشاهده می کنیم)، برای این منظور، می توانیم مشخصه های transform:skewY و ms-transform:skewY- و webkit-transform:skewY- در CSS را برای آن عنصر ذکر نماییم.

به عنوان مثال، فرض کنید که یک عنصر با id برابر kelidestan داریم و قصد داریم که به اندازه 30 درجه (Degree) چرخش (Rotation) به صورت کج شدن (Skew) نسبت به محور Y داشته باشد، بنابراین کد CSS زیر را برای آن عنصر می نویسیم :

به مثال زیر توجه کنید :

مثال

کد کامل صفحه HTML :

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
نکته

میزان چرخش (Rotation) به صورت کج شدن (Skew) را با عدد منفی نیز می توانیم بیان کنیم تا جهت چرخش (Rotation) در جهت برعکس باشد.

به مثال زیر توجه کنید :

مثال

کد کامل صفحه HTML :

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
نکته

دلیل به کار بردن 3 مشخصه (Property) در کدهای CSS ، عمل کردن کدها در تمامی مرورگرهای اینترنت (Browser) می باشد.

نویسنده علیرضا گلمکانی
شماره کلید 26382
گزینه ها
به اشتراک گذاری (Share) در شبکه های اجتماعی
نظرات 0 0 0

ارسال نظر جدید (بدون نیاز به عضو بودن در وب سایت)