وظيفة scaleX() في CSS

التعريف والاستخدام

CSS scaleX() الوظيفة تستخدم لتوسيع العناصر بشكل أفقي.

scaleX() الوظيفة تزيد أو تقلل عرض العنصر.

scaleX() الوظيفة في تحويل في استخدام الخصائص.

مثال

مثال 1

استخدام scaleX() توسيع عرض عدة عناصر <div>:

#myDiv1 {
  transform: scaleX(0.7);
}
#myDiv2 {
  transform: scaleX(90%);
}
#myDiv3 {
  transform: scaleX(1.1);
}

تجربة شخصية

مثال 2

استخدام scaleX() توسيع عرض الصورة:

#img1 {
  transform: scaleX(0.6);
}
#img2 {
  transform: scaleX(90%);
}
#img3 {
  transform: scaleX(-0.6);
}
#img4 {
  transform: scaleX(1.1);
}

تجربة شخصية

القواعد النصية لـ CSS

scaleX(s)
القيمة الوصف
s مطلوب. تحديد الأرقام للإتجاهات المقياس للعرض.

تفاصيل التقنية

الإصدار: CSS Transforms Module Level 1

دعم المتصفح

الرقم في الجدول يعني إصدار المتصفح الذي يدعم هذه الوظيفة تمامًا لأول مرة.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

الصفحات ذات الصلة

دروس:تحويل 2D CSS

المرجع:خصائص transform CSS

المرجع:خصائص scale CSS

المرجع:دالة scale() CSS

المرجع:دالة scale3d() CSS

المرجع:دالة scaleY() CSS