การTransformsและการย้ายตำแหน่งใน HTML5

การTransformsและการย้ายตำแหน่งใน HTML5

หมวดหมู่: พัฒนาเว็บไซต์เขียนโปรแกรมHTML5 and CSS3

การทรานส์ฟอร์ม
     
ถูกรองรับใน firefox 3.5+, Opera 10.5, Webkit ตั้งแต่รู่น 3.2 หรือแม้แต่ Intrenet Explorer 9 พร็อปเพอร์ตี้ transforms ของ CSS3 ทำให้เราสามารถ ย้าย หมุน ปรับขนาด หรือบิดอิลิเมนต์ใดๆ ในหน้าเว็บได้ ขณะที่เอฟเฟ็กต์บางอย่างเหล่านี้อาจจะใช้ได้ใน CSS รุ่นก่อนๆ เช่น การกำหนดตำแหน่งแบบสัมพันธ์ และสัมบูรณ์) CSS3 ทำให้สามารถควบคุมสิ่งที่ไม่เคยทำได้มาก่อนในหลายๆ ด้านกับหน้าตาของอิลิเมนต์

     เราสามารถดำเนินการกับหน้าตาโดยใช้อิลิเมนต์ ชื่อ ฟังก์ชั่นทรานส์ฟอร์ม ค่าของพร็อปเพอร์ตี้ transform คือ ฟังก์ชั่นทรานฟอร์มหนึ่งหรือหลายฟังก์ชั่นที่คั่นด้วยช่องว่าง ซึ่งจะถูกใช้งานตามลำดับที่มันถูกกำหนดไว้

ดังตัวอย่างนี้

การย้ายตำแหน่ง
    การย้ายตำแหน่งทำให้คุณสามารถเคลื่อนย้ายตำแหน่งอิลิเมนต์ไปทาง ซ้าย ขวา บนหรือล่าง ฟังก์ชั่นเหล่านี้มีการกระทำเหมือนและคล้ายกับ position: relative; ที่คุณต้องการประกาศ top และ left เมื่อคุณใช้งานการย้านตำแหน่ง คุณจะสามารถย้ายตำแหน่งของอิลิเมนต์ โดยไม่ส่งผลกระทบต่อการไหลของเอกสารเลย
 

 

ไอทีจีเนียส เอ็นจิเนียริ่ง (IT Genius Engineering) ให้บริการด้านไอทีครบวงจร ทั้งงานด้านการอบรม (Training) สัมมนา รับงานเขียนโปรแกรม เว็บไซต์ แอพพลิเคชั่น งานออกแบบกราฟิก และงานด้าน E-Marketing ที่กำลังได้รับความนิยมในปัจจุบัน ทั้ง SEO , PPC , และ Social media marketting

ติดต่อเราเพื่อสอบถามผลิตภัณฑ์ ขอราคา หรือปรึกษาเรื่องไอที ได้เลยค่ะ

Line : @itgenius (มี @ ด้านหน้า) หรือ https://lin.ee/xoFlBFe
Facebook : https://www.facebook.com/itgeniusonline
Tel : 02-570-8449 มือถือ 088-807-9770 และ 092-841-7931
Email : contact@itgenius.co.th
user
โดย Admin ITGenius
เข้าชม 4,466 ครั้ง

คำค้นหา : การทรานส์ฟอร์มtransforms คือการย้ายตำแหน่งตัวอย่างการทรานส์ฟอร์มทรานส์ฟอร์มใน HTML5ลักษณะการทรานส์ฟอร์มรูปแบบการทรานส์ฟอร์มการทรานส์ฟอร์มแบบสามมิติ