CSS scaleX() 函数

定义和用法

CSS 的 scaleX() 函数用于水平缩放元素。

scaleX() 函数增加或减少元素的宽度。

scaleX() 函数在 transform 属性中使用。

实例

例子 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)

技术细节

浏览器支持

表格中的数字表示首个完全支持该函数的浏览器版本。

หน้าที่เกี่ยวข้อง

วิธีการ:การทบทวน 2D ของ CSS

อ้างอิง:CSS การทำการทบทวน

อ้างอิง:CSS scale คุณสมบัติ

อ้างอิง:ฟังก์ชัน scale() ของ CSS

อ้างอิง:ฟังก์ชัน scale3d() ของ CSS

อ้างอิง:ฟังก์ชัน scaleY() ของ CSS