ฟังก์ชัน scaleY() ของ CSS

การระบุและการใช้งาน

CSS scaleY() ฟังก์ชันใช้ในการย่อยองค์ประกอบตามแนวตั้ง

scaleY() ฟังก์ชันเพิ่มหรือลดความสูงขององค์ประกอบ

scaleY() ฟังก์ชันใน transform ใช้ในคุณสมบัติ

ตัวอย่าง

ตัวอย่าง 1

ใช้ scaleY() ย่อยขนาดสูงของหลายตัวแบบ <div> :

#myDiv1 {
  transform: scaleY(0.5);
}
#myDiv2 {
  transform: scaleY(70%);
}
#myDiv3 {
  transform: scaleY(1.1);
}

ทดลองด้วยตัวเอง

ตัวอย่าง 2

ใช้ scaleY() ขนาดสูงของภาพที่ย่อย:

#img1 {
  transform: scaleY(0.5);
}
#img2 {
  transform: scaleY(70%);
}
#img3 {
  transform: scaleY(-0.5);
}
#img4 {
  transform: scaleY(1.1);
}

ทดลองด้วยตัวเอง

CSS โซนภาษา

scaleY(s)
ค่า รายละเอียด
s สำคัญ。ระบุตัวเลขของแวยที่ย่อยขนาดสูงของสัญญาณ

รายละเอียดเทคนิค

รุ่น: CSS Transforms Module Level 1

การสนับสนุนเบราเซอร์

ตัวเลขในตารางแสดงรุ่นที่สนับสนุนการใช้ฟังก์ชันนี้อย่างเต็มที่ของเบราเซอร์

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

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

ความรู้ทั่วไป:การทบทวน 2D ของ CSS

อ้างอิง:CSS transform ทางใช้

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

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

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

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