rotateY() Function
تابع ()rotateY
در CSS مشخص می کند که عنصر حول نقطه ای در محور (Y
) عمودی بچرخد.
نحوه نوشتار
transform: rotateY(45deg); transform: rotateY(-30deg); transform: rotateY(alpha);
مقادیر
درجه (alpha)
میزان چرخش را در محور y
یا عمودی مشخص می کند. اگر مقدار مثبت باشد، این چرخش ساعتگرد و اگر منفی باشد پاد ساعتگرد خواهد بود.
در مثال زیر نحوه عملکرد این تابع CSS را میبینیم:
html
<section> <div class="box">this is normal box</div> </section> <section> <div class="box1">this is box1</div> <div class="box2">this is box2</div> <div class="box3">this is box3</div> </section>
css
section { display: flex; justify-content: space-around; flex-wrap: wrap; padding: 20px 0; } div { width: 130px; height: 130px; background-color: pink; display: flex; justify-content: center; align-items: center; } .box { background-color: lightgreen; } .box1 { transform: rotateX(25deg); } .box2 { transform: rotateX(45deg); } .box3 { transform: rotateX(65deg); }
مشاهده و ویرایش کد در حالت تمام صفحه
پشتیبانی مرورگرها
تمام مرورگرها از این تابع CSS پشتیبانی می کنند.