ในการทำเว็บไซต์ ผู้ทำเว็บไซต์จะต้องออกแบบหน้าตารูปแบบของเว็บไซต์ที่ยังไม่ได้มีการใส่เนื้อหาเข้าไปหรือที่เรียกว่า Template ซึ่งมีให้ดาวน์โหลดฟรีมากมาย แต่การนำมาใช้ อาจจะต้องปรับบางส่วนให้เข้ากับรูปแบบเว็บไซต์ที่เราต้องการ หนึ่งในนั้นคือการปรับระยะห่างระหว่างขอบของวัตถุกับพื้นที่ด้านนอก โดยใช้คำสั่ง margin ในไฟล์ CSS
margin ใน CSS คือการปรับระยะห่างระหว่างขอบของวัตถุกับพื้นที่ขอบด้านนอก มีทั้งหมด 5 รูปแบบ
1.margin เป็นการปรับระยะห่างทั้ง 4 ด้าน
2.margin-top เป็นการปรับระยะห่างด้านบนของวัตถุเพียงด้านเดียว
3.margin-bottom เป็นการปรับระยะห่างด้านล่างของวัตถุเพียงด้านเดียว
4.margin-left เป็นการปรับระยะห่างด้านซ้ายของวัตถุเพียงด้านเดียว
5.margin-right เป็นการปรับระยะห่างด้านขวาของวัตถุเพียงด้านเดียว
ตัวอย่างโค้ด ในไฟล์ user.css แทรกโค้ด margin ในส่วนของ breadcrumb เพื่อปรับตำแหน่ง Pathway ให้อยู่ในตำแหน่งที่ต้องการ
margin: 36px 0;
margin-left: 129px;
margin-right: -120px;
ภาพก่อนการปรับ margin
ผลลัพธ์หลังจากการปรับ margin
เนื้อหาเพิ่มเติม