Friday, 7 February 2025

การจัดตำแหน่งด้วย position ใน CSS

01 May 2018
159
luminox watches

การจัดตำแหน่งด้วย position ใน CSS จะช่วยให้เราสามารถควบคุมตำแหน่งของ HTML element ได้อย่างมีประสิทธิภาพ โดย CSS มี 4 ประเภทของ position ได้แก่ static, relative, absolute, และ fixed ดังนี้

static – คือการกำหนดตำแหน่งที่เป็นค่าเริ่มต้นของ HTML element และไม่สามารถเลื่อนตำแหน่งได้ด้วยการใช้ margin หรือ padding

relative – คือการกำหนดตำแหน่งของ HTML element โดยอ้างอิงจากตำแหน่งเริ่มต้นของ element นั้น ๆ โดยสามารถเลื่อนตำแหน่งได้ด้วยการใช้ margin หรือ padding

absolute – คือการกำหนดตำแหน่งของ HTML element โดยอ้างอิงจากตำแหน่งของ element ที่มี position แบบ relative หรือ absolute โดยสามารถเลื่อนตำแหน่งได้ด้วยการใช้ margin หรือ padding

fixed – คือการกำหนดตำแหน่งของ HTML element ให้ติดอยู่บนหน้าจอและไม่เปลี่ยนแปลงตำแหน่งเมื่อเลื่อนหน้าจอ โดยไม่สามารถเลื่อนตำแหน่งได้ด้วยการใช้ margin หรือ padding

การใช้งาน position ใน CSS ควรพิจารณาให้ละเอียด โดยต้องเลือกใช้ position ที่เหมาะสมกับการจัดแสดงของ HTML element และสามารถแสดงผลได้อย่างถูกต้องและเป็นไปตามที่ต้องการของผู้ใช้งาน.

Thanat Sirikitphattana

แบ่งปันกัน เราอยู่กันไม่เกิน 100 ปีหรอกครับ
สุดท้ายก็ทิ้งไว้ที่โลก จะคงเหลือไว้แต่คุณงามความดีที่ให้ระลึกถึงกันครับ

Follow Us / Thanat Sirikitphattana