ตัวสร้างการเปลี่ยน CSS3

การเปลี่ยนความทึบที่ราบรื่น

ค่าที่ตั้งไว้ล่วงหน้ายอดนิยม

เอฟเฟกต์จาง

การเปลี่ยนความทึบที่ราบรื่น

เอฟเฟกต์มาตราส่วน

ปรับขนาดองค์ประกอบเมื่อวางเมาส์เหนือ

เอฟเฟกต์หมุน

หมุนองค์ประกอบเมื่อวางเมาส์เหนือ

เอฟเฟกต์สไลด์

ย้ายตําแหน่งองค์ประกอบ

เปลี่ยนสี

การเปลี่ยนสีพื้นหลัง

เกี่ยวกับการเปลี่ยนภาพ

การเปลี่ยน CSS ช่วยให้คุณเปลี่ยนค่าคุณสมบัติได้อย่างราบรื่นในช่วงเวลาที่กําหนด

คุณสมบัติภาพเคลื่อนไหวทั่วไป ได้แก่ :

  • ความกว้างความสูง
  • ระยะขอบ, ช่องว่างภายใน
  • ความทึบ, สี
  • transform (scale, rotate, translate)
  • background-color

เคล็ดลับสําหรับมือโปร: ใช้ตัวเลือก 'คุณสมบัติทั้งหมด' เพื่อทําให้การเปลี่ยนแปลงทั้งหมดเคลื่อนไหว

Preview

HOVER ME

รหัสที่สร้างขึ้น

.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; }  .element:hover { /* Hover styles will be generated here */ }

การควบคุมการเปลี่ยนผ่าน

300
0

เอฟเฟกต์โฮเวอร์

100%
100%
0px
0px
8px
8px

Related Tools

ตัวย่อขนาด CSS

บีบอัดและเพิ่มประสิทธิภาพโค้ด CSS ของคุณด้วยความแม่นยําระดับมืออาชีพ

Less to CSS Converter

แปลงโค้ด Less ของคุณเป็น CSS รวดเร็ว ง่ายดาย และปลอดภัย

สร้างการแปลง CSS3 ได้อย่างง่ายดาย

เครื่องมือที่ทรงพลังและใช้งานง่ายสําหรับการสร้างการแปลง CSS3 ที่ซับซ้อนโดยไม่ต้องเขียนโค้ด แสดงภาพการเปลี่ยนแปลงแบบเรียลไทม์และคัดลอก CSS ที่สร้างขึ้นเพื่อใช้ในโครงการของคุณ

ตัวแปลงตัวเลขดิจิตอล

แปลงระหว่างระบบเลขฐานสอง ทศนิยม เลขฐานสิบหก และฐานแปดอย่างแม่นยํา

Generate dummy text for your designs

สร้างข้อความตัวยึดตําแหน่งที่สมจริงสําหรับเว็บไซต์ แอป และเอกสารของคุณด้วยตัวสร้าง Lorem Ipsum ของเรา

HSV เป็น HEX

แปลงรหัสสี HSV เป็นค่า HEX สําหรับการออกแบบเว็บ