CSS margin รายการ

คำนิยามและการใช้งาน

เอกสารย่อยของ margin กำหนดขอบเขตด้านนอกทั้งหมดขององค์ประกอบในอ่างการประกาศเดียว ค่านี้สามารถมีค่า 1 ถึง 4 ของค่า

รายละเอียด

เอกสารย่อยนี้กำหนดความกว้างของขอบเขตด้านนอกทั้งหมดขององค์ประกอบหรือกำหนดความกว้างของขอบเขตด้านนอกของบริเวณต่างๆ

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

หมายเหตุ:อนุญาตให้ใช้ค่าลบ

ตัวอย่าง 1

margin:10px 5px 15px 20px;
  • ขอบเขตด้านบนคือ 10px
  • ขอบเขตด้านขวาคือ 5px
  • ขอบเขตด้านล่างคือ 15px
  • ขอบเขตด้านซ้ายคือ 20px

ตัวอย่าง 2

margin:10px 5px 15px;
  • ขอบเขตด้านบนคือ 10px
  • ขอบเขตด้านขวาและขอบเขตด้านซ้ายคือ 5px
  • ขอบเขตด้านล่างคือ 15px

ตัวอย่าง 3

margin:10px 5px;
  • ขอบเขตด้านบนและขอบเขตด้านล่างคือ 10px
  • ขอบเขตด้านขวาและขอบเขตด้านซ้ายคือ 5px

ตัวอย่าง 4

margin:10px;
  • ขอบเขตด้านนอกสี่บริเวณทั้งหมดคือ 10px

ดูเพิ่มเติมที่:

ตัวอย่าง CSS:CSS ชนะพื้นที่ด้านนอก

คู่มือการสอบถาม HTML DOM:ขอบเขตด้านนอก

ตัวอย่าง

ตั้งค่าขอบเขตด้านนอกสี่บริเวณของตัวแปร p:

p
  {
  margin:2cm 4cm 3cm 4cm;
  }

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

เอกสารระบบ CSS:

margin: length|auto|initial|inherit;

ค่ารายละเอียดของ属性

ค่า รายละเอียด
auto เบราวเซอร์คำนวณขอบเขตด้านนอก
length กำหนดค่าขอบเขตด้านนอกด้วยหน่วยความยาวเฉพาะเจาะจง อย่างเช่นพิกเซล ซีเมนต์ และอื่นๆ ค่าเริ่มต้นคือ 0px。
% กำหนดขอบเขตด้านนอกด้วยเปอร์เซ็นต์ของความกว้างของตัวประกอบ。
inherit กำหนดให้มีการสืบทอดขอบเขตด้านนอกจากตัวปัจจุบัน。

รายละเอียดเทคโนโลยี

ค่าเริ่มต้น: 0
เชื่อมโยงต่อเนื่อง: no
เวอร์ชัน: CSS1
เอกสารระบบ JavaScript: object.style.margin="10px 5px"

ตัวอย่างเพิ่มเติม

ขอบเขตทั้งหมดในอ่างการประกาศเดียว
ตัวอย่างนี้แสดงวิธีการจัดตั้งค่าทุกตัวแปรของขอบเขตในอ่างการประกาศเดียว。

การสนับสนุนโปรแกรมน่าเชื่อถือ

ตัวเลขในตารางชี้ถึงเวอร์ชันบราวเซอร์ที่สนับสนุนคุณสมบัตินี้อย่างเต็มที่。

Chrome IE / Edge Firefox Safari Opera
1.0 6.0 1.0 1.0 3.5