Comment remplacer mondial de style pour la balise img dans le css

J'ai un modèle qui met mondiale img propriétés de la balise en tant que tel:

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

J'ai une liste sur ma page et l'un des éléments les besoins d'avoir une petite image transparente. Le style ci-dessus est à l'origine de l'image pour obtenir un arrière-plan et les frontières que je ne veux pas. La liste html est:

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

J'ai essayé de remplacer la balise img avec le code ci-dessous, mais Firebug continue de montrer à ces règles avec un "barré", indiquant le mondial img style ci-dessus prend la priorité. J'entends ce pourrait être parce que le code css styles de remplacer classe les styles. Comment puis-je y arriver?

li.trace_item img {
    background-color: transparent;
    border: none;
    padding: 0;
    margin: 0;
}
InformationsquelleAutor zee | 2011-05-15
  1. 16

    C'est parce que CSS utilise la spécificité lors de l'application de styles (en cascade)

    Il doit travailler pour vous si vous la changez pour 

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

    Voici la spécificité expliqué dans Star Wars termes : http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html

    • +1 pour le Star Wars de référence. Cela fonctionne, merci!
    • umm, je me sens tellement gourmande de demander, mais avez-vous cliquez sur la flèche vers le haut? Pas de +1 pour moi 🙁
    • oups, rookie, DONC erreur de l'utilisateur. Et voila!
    • bien obligé!
    InformationsquelleAutor JohnP
  2. 1

    Simplement précéder #contenu de votre principale sélecteur css:

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

    Voir une démo ici: http://jsfiddle.net/alp82/A5rHY/6/

    InformationsquelleAutor Alp
  3. 0
    #content li.trace_item img {
    background-color: transparent;
    border: none;
    padding: 0;
    margin: 0;
}
    InformationsquelleAutor Daniel O'Hara
  4. 0

    vous disposez de différentes options
    vous convertir l'id de contenu à un contenu de classe ou de la conversion de la trace_item classe à un id ou
    vous ajoutez le !important pour votre trace_item de la classe ou de la faire précéder de #contenu .trace_item travaille aussi

    InformationsquelleAutor Daniel Ruf