ฟังก์ชัน CSS translateY()
- หน้าก่อน CSS translateX() ฟังก์ชัน
- หน้าต่อไป CSS url() ฟังก์ชัน
- กลับไปยังระดับเดิม คู่มืออ้างอิงฟังก์ชัน CSS
การกำหนดและการใช้งาน
CSS translateY()
ฟังก์ชันที่อนุญาตให้คุณเปลี่ยนที่ตั้งองค์ประกอบตามตัวเลข y (แนวตั้ง)
translateY()
ฟังก์ชันใน transform
ใช้ในอัตรายอด
ตัวอย่าง
เปลี่ยนที่ตั้งแบบตามทิศทางตั้งแต่ต้นทางต่างกันของ <div> ต่างๆ ในแนวตั้ง
#myDiv1 { transform: translateY(30px); /* ย้ายองค์ประกอบตามตัวเลข y 30px */ } #myDiv2 { transform: translateY(50px); /* ย้ายองค์ประกอบตามตัวเลข y 50px */ } #myDiv3 { transform: translateY(-10px); /* ย้ายองค์ประกอบตามตัวเลข y -10px */ }
รูปแบบ CSS
translateY(y)
ค่า | รายละเอียด |
---|---|
y | สำคัญ。กำหนดระยะทางขององค์ประกอบตามตัวเลข y หรือเปอร์เซ็นต์。 |
รายละเอียดเทคนิค
รุ่น: | CSS Transforms Module Level 1 |
---|
การสนับสนุนบราวเซอร์
ตัวเลขในตารางนี้แสดงรุ่นบราวเซอร์ที่สนับสนุนฟังก์ชันนี้อย่างเต็มที่。
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
1 | 12 | 3.5 | 3.1 | 10.5 |
หน้าเกี่ยวข้อง
ความรู้ทางการเรียนCSS 2D โหวตยัน
อ้างอิง:CSS transform คุณสมบัติ
อ้างอิง:CSS translate() ฟังก์ชัน
อ้างอิง:CSS translateX() ฟังก์ชัน
อ้างอิง:CSS HTML DOM transform คุณสมบัติ
- หน้าก่อน CSS translateX() ฟังก์ชัน
- หน้าต่อไป CSS url() ฟังก์ชัน
- กลับไปยังระดับเดิม คู่มืออ้างอิงฟังก์ชัน CSS