ฉันจะลบภาพพื้นหลังใน css ได้อย่างไร


192

ฉันมีกฎทั่วไปที่ให้ภาพพื้นหลังของ DIV ทั้งหมด
ฉันมี div หนึ่งตัว (พร้อม id = 'a') ซึ่งฉันไม่ต้องการให้มีภาพพื้นหลัง
ฉันต้องให้กฎอะไรกับ css

คำตอบ:


342

ลอง:

div#a {
    background-image:none
}

13
#a {}ใช้เพียงแค่ อย่าใช้ประเภทองค์ประกอบในตัวเลือกถ้าไม่จำเป็น
Jezen Thomas

3
"การหลีกเลี่ยงตัวเลือกบรรพบุรุษที่ไม่จำเป็นมีประโยชน์สำหรับเหตุผลด้านประสิทธิภาพ" ไม่ใช่ปัญหาจริงๆเมื่อคุณไม่ใช่ Google
Davor

คำแนะนำ W3C เกี่ยวกับ CSS 3 Selectors> การคำนวณความเฉพาะเจาะจงของตัวเลือกw3.org/TR/css3-selectors/#specificity
TarranJones


30
div#a {
  background-image: none !important;
}

แม้ว่า "! สำคัญ" อาจไม่จำเป็นเพราะ "div # a" มีความเฉพาะเจาะจงมากกว่า "div"


ไม่จำเป็นต้องใช้ส่วน!! เนื่องจากการประกาศด้วย # มีความแม่นยำมากกว่าการประกาศ div ดังนั้นจึงใช้กฎนี้แทนกฎ div ทั่วไป
Ruud

1
ฉันพบ! สิ่งสำคัญที่จำเป็นใน Chrome
dlchambers

17
div#a {
  background-image: url('../images/spacer.png');
  background-image: none !important;
}

ฉันใช้อิมเมจตัวเว้นวรรคแบบโปร่งใสนอกเหนือจากกฎเพื่อลบภาพพื้นหลังเนื่องจาก IE6 ดูเหมือนว่าจะไม่สนใจbackground-image: noneแม้ว่าจะมีการทำเครื่องหมายไว้!importantก็ตาม


6
ใครสนใจ IE6 ในวันนี้
Rob W

-1 คำตอบของคุณไม่ถูกต้อง ฉันเริ่ม IE6 และbackground-image:none;(โดยไม่มี ot !important) ทำงานได้อย่างไม่มีที่ติ
Rob W

8
ที่จริงแล้วฉันสนใจ - หนึ่งในลูกค้าของฉันมีสภาพแวดล้อมเครือข่ายแยกด้วยซอฟต์แวร์เฉพาะบางอย่างที่ไม่ได้รับการปรับปรุง IE6 คือสิ่งที่พวกเขาต้องใช้ เศร้า แต่จริง :(
รัสคลาร์ก

5
มี upvote เพื่อลด Downvote ของ Rob W มันค่อนข้างหยาบคายกับเขาที่จะลงคะแนนเพียงเพื่อความเข้ากันได้แบบย้อนหลังที่ไม่ใช่แม้แต่แฮ็คไม่ว่าเขาจะทำซ้ำได้หรือไม่ก็ตาม
Kavi Siegel

8

เนื่องจากใน css3 หนึ่งอาจตั้งค่าภาพพื้นหลังหลายรายการการตั้งค่า "ไม่มี" จะสร้างเลเยอร์ใหม่และซ่อนอะไรเลย

http://www.css3.info/preview/multiple-backgrounds/ http://www.w3.org/TR/css3-background/#backgrounds

ฉันยังไม่พบวิธีแก้ปัญหา ...


ฉันเชื่อ "พื้นหลัง: ไม่มี;" จะแทนที่
circusdei

2
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(0.5, #fff));
background-image: -webkit-linear-gradient(center top, #fff 0%, #fff 50%);
background-image: -moz-linear-gradient(center top, #fff 0%, #fff 50%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0);
background-image: linear-gradient(to bottom, #fff 0%, #fff 50%);

สำหรับเบราว์เซอร์รุ่นเก่า .. หากคุณกำหนด css ใน framewokrk.css เช่น select2.css ใน IE9 background-image: -webkit-gradient เป็นต้นและคุณต้องการมันผ่าน. css อีกอันเขียนด้วย "background-image: none! important" ไม่ทำงาน ฉันใช้สีเดียวกันเพื่อไล่ระดับสีเช่นสีพื้นหลังของหน้า


1

หากกฎ div ของคุณเป็นธรรมdiv {...}ก็#a {...}จะเพียงพอ ถ้ามันมีความซับซ้อนมากขึ้นคุณจะต้องเป็น "เฉพาะเจาะจงมากขึ้น" เลือกคำที่กำหนดโดยสเปค CSS ในความจำเพาะ (#a มีความเจาะจงมากกว่า div เป็นเพียงด้านเดียวในอัลกอริทึม)




โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.