สีพื้นหลัง: ไม่มี CSS ที่ถูกต้อง?

431

มีใครบอกฉันได้ไหมว่า CSS ต่อไปนี้ถูกต้อง?

.class {
    background-color:none;
}

css background-color

— NarfkX
แหล่งที่มา

10

เครื่องมือตรวจสอบสามารถตอบคำถามประเภทนี้ได้บ่อยครั้ง

— สามสิบ

10

คุณอาจสับสนbackground:none;ซึ่งถูกต้องและกำหนดสีพื้นหลังให้โปร่งใส

— Mr Lister

551

คุณอาจต้องการtransparentเนื่องจากnoneไม่ใช่background-colorค่าที่ถูกต้อง

CSS 2.1 สเปคกล่าวต่อไปนี้สำหรับbackground-colorคุณสมบัติ:

Value: <color> | transparent | inherit

<color>สามารถเป็นได้ทั้งคำหลักหรือการแสดงตัวเลขของสี คำหลักที่ถูกต้องcolorคือ:

น้ำ, สีดำ, เปลี่ยนเป็นสีน้ำเงิน, สีแดงม่วง, เทา, เขียว, มะนาว, แดง, กองทัพเรือ, มะกอก, ออเรนจ์, สีม่วง, แดง, เงิน, นกเป็ดน้ำ, ขาว, เหลือง

transparentและinheritเป็นคำหลักที่ถูกต้องในสิทธิของตนเอง แต่noneไม่ใช่

— James Allardice
แหล่งที่มา

25

ใช่. เนื่องจากค่าเริ่มต้นคือtransparentว่าเป็นสิ่งที่คุณใช้ถ้าคุณต้องการที่จะเปิดสีพื้นหลัง "ปิด"

— นาย Lister

1

สิ่งเหล่านี้จะไม่ถูกรีเซ็ตเป็นค่าก่อนหน้า (เช่นถ้าตั้งค่าโดยกฎ css อื่น :(

— pstanton

2

@pstanton ในกรณีของคุณคุณต้องให้สีพื้นหลัง: โปร่งใส! สำคัญ;

— her

สิ่งนี้ทำให้ฉันนึกถึงการพยายามใช้สีแบบอักษรเมื่อฉันเริ่มเขียนโค้ด แน่นอนมันไม่ได้color font-colorทำให้รู้สึกมากเมื่อใดก็ตามที่เคยคุณสมบัติอื่น ๆ ที่มีตัวอักษรfontในด้านหน้าของมัน ...

— serraosays

@ Herr แต่ก็ยังเป็น pstanton กล่าวว่าการตั้งค่าสีพื้นหลังโปร่งใสจะแทนที่คุณสมบัติ CSS ก่อนหน้า! มีวิธีใดที่จะลบคุณสมบัติสีพื้นหลังนี้เพื่อให้มันใช้คุณสมบัติ CSS จากก่อนหน้านี้?

— SE_ ผู้ใช้

159

ไม่มีใช้แทนtransparent noneดูตัวอย่างการทำงานที่นี่ในตัวอย่างนี้ถ้าคุณจะเปลี่ยนtransparentไปnoneมันจะไม่ทำงาน

ใช้เช่น .class { background-color:transparent; }

โดยที่. classคือสิ่งที่คุณจะตั้งชื่อคลาสโปร่งใสของคุณ

— Jitendra Vyas
แหล่งที่มา

ในตัวอย่างของฉันมันตรงกันข้ามอย่างสมบูรณ์ หากคุณเปลี่ยนไม่มีการโปร่งใสมันจะไม่ทำงาน ฉันไม่จำเป็นต้องใช้จริงๆ: jsfiddle.net/BkAad

— Hrvoje Golcic

ในตัวอย่างของคุณให้เปลี่ยนเป็น body *: not (.exception) {background-color: transparent} คุณต้องลบเครื่องหมาย!! สำคัญเพราะนั่นคือการบังคับให้คนอื่น ๆ ทั้งหมดที่อยู่ภายในมีคุณสมบัตินั้น และด้านในควรใช้คุณสมบัติสีพื้นหลังมากกว่าสีพื้นหลังเพื่อใช้สีพื้นหลังเพียงอย่างเดียว

— yveslebeau

67

คำตอบคือไม่

ไม่ถูกต้อง

.class {
    background-color: none; /* do not do this */
}

แก้ไข

.class {
    background-color: transparent;
}

background-color: transparentทำสิ่งเดียวกันกับที่คุณต้องการให้background-color: noneสำเร็จ

— Sajidur Rahman
แหล่งที่มา

7

.class {
    background-color:none;
}

นี่ไม่ใช่คุณสมบัติที่ถูกต้อง เครื่องมือตรวจสอบ W3C จะแสดงข้อผิดพลาดต่อไปนี้:

ข้อผิดพลาดของค่า: background-color none ไม่ใช่ค่า background-color: none

transparentอาจถูกเลือกให้เป็นคำที่ดีกว่าแทน0หรือnoneค่าในระหว่างการพัฒนาข้อกำหนดของ CSS

— Barun
แหล่งที่มา

2

และนี่เป็นการทำซ้ำสิ่งที่เจมส์พูดเมื่อสองปีครึ่งที่ผ่านมา แต่ในรูปแบบที่ไม่ตัดและวางได้ ; ^)

— ruffin

6

CSS ระดับ 3 ระบุunsetค่าคุณสมบัติ จากMDN :

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

น่าเสียดายที่ค่านี้ไม่ได้รับการสนับสนุนในทุกเบราว์เซอร์รวมถึง IE, Safari และ Opera ฉันแนะนำให้ใช้transparentในขณะนี้

— Gert Hengeveld
แหล่งที่มา

3

เขียนสิ่งนี้:

.class {
background-color:transparent;
}

— Abolfazl Miadian
แหล่งที่มา

2

โปรดอธิบายรหัสของคุณและช่วยแก้ปัญหาได้อย่างไร! - จากการรีวิว

— Luca Kiebel

ตกลง. พื้นหลังสีเป็นคุณลักษณะ css และเช่นเดียวกับทุกแอตทริบิวต์ css สามารถมีค่าที่ถูกต้องและไม่ถูกต้อง ค่าที่ถูกต้องสำหรับสีพื้นหลังสามารถเป็นหนึ่งในรูปแบบด้านล่าง: # 5f9 หรือ # 56f293 หรือโปร่งใส โปร่งใสหมายถึงคุณต้องการสีพื้นหลังเป็นศูนย์หรือไม่มีสี

— Abolfazl Miadian

1

ว้าว - 6 ปีหลังจากคำถาม (และคำตอบ) คุณตอบด้วยซ้ำหรือไม่

— NarfkX

เวลาถามไม่สำคัญเพราะทุกวันมีบางคนเข้าเยี่ยมชมหน้านี้หรืออีกหน้าเก่าเพื่อหาคำตอบฉันคิดว่าไวยากรณ์คำตอบของฉันชัดเจนกว่า!

— Abolfazl Miadian

1

ดังนั้นฉันต้องการอธิบายสถานการณ์ที่ฉันต้องใช้ประโยชน์จากโซลูชันนี้ โดยพื้นฐานแล้วฉันต้องการยกเลิกการตั้งค่าคุณสมบัติสีพื้นหลังโดย CSS อื่น ผลลัพธ์สุดท้ายที่คาดหวังคือทำให้ดูราวกับว่า CSS ดั้งเดิมไม่เคยใช้คุณสมบัติสีพื้นหลัง การตั้งค่าbackground-color:transparent;ทำให้มีประสิทธิภาพ

— Binita Bharati
แหล่งที่มา

1

ฉันพบพื้นหลังนั้น: transparent ไม่ทำงานสำหรับฉันที่จะแทนที่สีพื้นหลังที่กำหนดโดย CSS อื่น ถ้าฉันเลือกพื้นหลัง: สีแดง; เช่น - ที่จะใช้งานได้ แต่พื้นหลัง: โปร่งใส กำลังอนุญาตให้สีพื้นหลัง css อื่น ๆ ยังคงอยู่ แนวคิดใดที่จะหยุดสิ่งนั้นได้?

— ผู้ช่วย Joel