Style backgroundRepeat 屬性

定義和用法

backgroundRepeat การตั้งค่าหรือกลับค่าของการซ้ำ (ทางแผ่) รูปภาพพื้นหลัง

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

รูปแบบ HTML:คุณสมบัติ background

เรียน CSS:CSS พื้นหลัง

เรียน CSS3:CSS3 พื้นหลัง

คู่มือ CSS:คุณสมบัติ background-repeat

ตัวอย่าง

ตัวอย่าง 1

ตั้งรูปภาพพื้นหลังเป็นการไม่ซ้ำ (no-repeat):

document.body.style.backgroundRepeat = "repeat-y";

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

ตัวอย่าง 2

เปลี่ยนคุณสมบัติ backgroundRepeat ขององค์ประกอบ DIV ที่ระบุ:

document.getElementById("myDIV").style.backgroundRepeat = "repeat-x";

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

ตัวอย่าง 3

ตั้งรูปภาพพื้นหลังเป็นการซ้ำตามแนวนอนหรือตั้งแนวตั้ง:

function repeatVer() {
  document.body.style.backgroundRepeat = "repeat-y";
}
function repeatHor() {
  document.body.style.backgroundRepeat = "repeat-x";
}

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

ตัวอย่าง 4

กลับค่า background-repeat ของเอกสาร:

alert(document.body.style.backgroundRepeat);

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

ภาษาบัญญัติ

กลับค่า backgroundRepeat:

object.style.backgroundRepeat

ตั้งคุณสมบัติ backgroundRepeat:

object.style.backgroundRepeat = "repeat|repeat-x|repeat-y|no-repeat|initial|inherit"

ค่าขององค์ประกอบ

ค่า คำอธิบาย
repeat รูปภาพพื้นหลังซ้ำตามแนวตั้งและนอน โดยเริ่มต้น
repeat-x รูปภาพพื้นหลังซ้ำตามแนวนอน
repeat-y รูปภาพพื้นหลังซ้ำตามแนวตั้ง
no-repeat รูปภาพพื้นหลังไม่ถูกซ้ำ
initial ตั้งคุณสมบัตินี้เป็นค่าเริ่มต้น โปรดดู: initial.
inherit ทำให้คุณสมบัตินี้ได้รับมาจากองค์ประกอบพ่อของเธอ โปรดดู: inherit.

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

ค่าเริ่มต้น: repeat
ค่าที่กลับมา: ข้อความสาย ที่แสดงว่ารูปภาพพื้นหลังจะถูกซ้ำอย่างไร:
เวอร์ชัน CSS: CSS1

การรองรับของบราวเซอร์

backgroundRepeat เป็นคุณสมบัติ CSS1 (1996) ตามที่ระบุ:

ทั้งหมดบราวเซอร์ทุกตัวเข้าถึงมันเต็มที่:

เชโร่ม เอดจ์ ไฟร็อกซ์ เซฟารี่ ออเปร่า IE
เชโร่ม เอดจ์ ไฟร็อกซ์ เซฟารี่ ออเปร่า IE
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน