कैसे सीएसएस में टैग img के लिए वैश्विक शैली ओवरराइड करने के लिए

Question

मैं जो इस तरह के रूप में वैश्विक img टैग गुण सेट एक टेम्पलेट है:

#content img { 
    background: none repeat scroll 0 0 #FFFFFF; 
    border: 1px solid #CFCFCF; 
    margin-bottom: 2px; 
    padding: 2px; 
} 

मैं अपने पन्ने पर एक सूची है और वस्तुओं में से एक एक छोटा सा की जरूरत है पारदर्शी छवि। उपरोक्त स्टाइल छवि को पृष्ठभूमि और सीमाएं प्राप्त करने का कारण बन रही है जो मैं नहीं चाहता हूं। सूची एचटीएमएल है:

<div id="land_items"> 
<ul> 
<li class="trace_item"> 
<a href="/imglink"><img src="img/popup.png"></a> 
</li> 
</ul> 
</div> 

मैं नीचे दिए गए कोड के साथ img टैग ओवरराइड करने के लिए कोशिश की है, लेकिन Firebug एक "स्ट्राइकथ्रू" ऊपर वैश्विक img स्टाइल का संकेत पूर्वता ले जा रहा है के साथ इन नियमों को दिखाने के लिए जारी है। मैंने यह सुना क्योंकि आईडी सीएसएस शैलियों वर्ग शैलियों को ओवरराइड कर सकते हैं। मैं इसे कैसे पूर्ण करूं?

li.trace_item img { 
    background-color: transparent; 
    border: none; 
    padding: 0; 
    margin: 0; 
} 

Answer 1

ऐसा इसलिए है क्योंकि सीएसएस specificity का उपयोग करता है अगर आप इसे

#content li.trace_item img { 
    background-color: transparent; 
    border: none; 
    padding: 0; 
    margin: 0; 
} 

यहाँ करने के लिए बदल जब शैलियों (यह झरने)

यह आप के लिए काम करना चाहिए लागू करने है विशिष्टता स्टार वार्स में विस्तार से बताया है शर्तें: http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html

Answer 2

#content li.trace_item img { 
    background-color: transparent; 
    border: none; 
    padding: 0; 
    margin: 0; 
} 

Answer 3

आपके पास अलग-अलग विकल्प हैं आप अपने trace_item वर्ग या आगे जोड़ते #content करने के लिए एक वर्ग सामग्री के लिए आईडी सामग्री बदल सकते हैं या आप एक आईडी के लिए trace_item वर्ग बदल सकते हैं या आप जोड़ना! महत्वपूर्ण .trace_item को भी अपने अधिभावी को

Answer 4

बस आगे जोड़ते #content काम करता है सीएसएस चयनकर्ता: http://jsfiddle.net/alp82/A5rHY/6/