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

หน้าก่อน CSS translate() ฟังก์ชัน
หน้าต่อไป CSS translateY() ฟังก์ชัน
กลับไปยังระดับเดิม คู่มืออ้างอิงฟังก์ชัน CSS

การกำหนดและการใช้งาน

CSS translateX() ฟังก์ชันที่อนุญาตให้คุณย้ายตำแหน่งองค์ประกอบตามทิศทาง x (ทิศนอก)。

translateX() ฟังก์ชันใน transform ใช้ในรูปแบบของคุณ

ตัวอย่าง

ย้ายตำแหน่งแบบระดับน้ำใต้ตามทิศทางนอกของ <div> ต่างกัน:

#myDiv1 {
  transform: translateX(50px); /* ย้ายองค์ประกอบตามนานาทีแบบเชิงพิกัด x 50px */
}
#myDiv2 {
  transform: translateX(100px); /* ย้ายองค์ประกอบตามนานาทีแบบเชิงพิกัด x 100px */
}
#myDiv3 {
  transform: translateX(-10px); /* ย้ายองค์ประกอบตามนานาทีแบบเชิงพิกัด x -10px */
}

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

การใช้ภาษา CSS

translateX(x)

ค่า	รายละเอียด
x	สำคัญ。กำหนดระยะทางการเคลื่อนไหวขององค์ประกอบตามนานาทีแบบเชิงพิกัด x ซึ่งอาจเป็นตัวเลขหรือเปอร์เซ็นต์。