Héritage CSS et remplaçant

Je suis nouveau sur CSS. Ive a créé un site Drupal et de jouer avec le thème.

J'ai peu de chapelure de trucs que je voudrais thème. Si je vais dans Firebug et désactiver les propriétés CSS

background
border-color
border-style

dans le code ci-dessous 

.breadcrumbs .inner {
    background: none repeat scroll 0 0 #EFEFEF;
    border-color: #929292 #E2E2E2 #FFFFFF;
    border-style: solid;
    border-width: 1px;
    color: #8E8E8E;
}

- Je obtenir le texte à la recherche exactement comment je le veux.

Si je vais dans mon style.css qui héritent le code et post

.breadcrumbs .inner {
    border-width: 1px;
    color: #8E8E8E;
}

La mise en forme je ne veux pas, c'est conservée. Si je précise .breadcrumbs .inner dans le style.css n'est-ce pas définir de nouveau et de remplacer ce qui a été spécifié plus haut, la cascade?

Si ce n'est pas le cas, comment puis-je arrêter l'héritage sans changer l'autre feuille de style?

Merci,

Andrew

Informations Supplémentaires

Voici ce que j'ai en ce moment

Héritage CSS et remplaçant

C'est ce que je veux avoir
Héritage CSS et remplaçant

  • Utilisez !important après chaque propriété que vous souhaitez remplacer. comme display:inline !important;
  • Je sais que c'est une mauvaise pratique. Sinon, juste de réinitialiser les propriétés allait bien, je suppose, si c'est exactement le même sélecteur et définis d'après la première, en utilisant par exemple background:transparent; doit l'emporter sur la première déclaration.
InformationsquelleAutor Andrew | 2011-01-27
  1. 8

    Vous êtes primordial CSS ne pas remplacer les 3 styles que vous souhaitez modifier, de sorte que les originaux sont conservés. Ce que vous voulez faire est d'avoir votre style.css mis quelque chose comme ceci: 

    .breadcrumbs .inner {
    background: none;
    border-color: transparent;
    border-style: none;
}
    • Merci pour la réponse j'ai essayé, actualisé le cache etc et il n'y a pas eu de changement quoi d'autre devrais-je essayer?
    • Basé sur les captures d'écran que vous avez ajouté, style.css ne contient pas de définition pour .breadcrumbs .inner Quand vous dites que vous rafraîchis la mémoire cache, avez-vous de vider tous vos fichiers internet temporaires, puis de recharger la page. Essayez également de la <CTRL>+F5, parfois F5 seul n'est tout simplement pas le faire. Autre que cela, je voudrais double assurez-vous que vous avez votre CSS des liens dans l'ordre que vous voulez (c'est à dire: le style.css une fois gris.css)
    • Juste une note de côté, sur chrome, vous pouvez faire un clic droit sur le bouton d'actualisation et sélectionnez vider le cache et de rechargement dur
    InformationsquelleAutor nybbler
  2. 3

    Si vous spécifiez les styles CSS pour le même cours deux fois par l'résultant de style est une union des attributs définis dans les deux classes. Pour supprimer les styles précédents, vous devez redéfinir les attributs.

    • Merci pour la réponse, pourriez-vous expliciter un peu plus ce que tu veux dire? Je ne sais pas si j'ai eu de la chance, mais quand j'ai suivi une méthode similaire, comme je l'ai indiqué dans mon premier post, les modifications appliquées.
    InformationsquelleAutor Chandu
  3. 0

    Par exemple si vous avez ces css attaché à votre document html

    <link rel="stylesheet" type="text/css" href="css/default.css">
<link rel="stylesheet" type="text/css" href="css/posts.css">

    si vous avez la même classe de dire .la couleur définie dans la les deux par défaut.css et des postes.les fichiers css, vous imaginez bien que le dernier fichier css sera utilisé, mais il peut être ignoré si vous l'écrire comme ceci:

    //default.css
.color {
   color: blue !important;
}

//posts.css
.color {
   color: green;
}
//In this example the colour would be blue.

    À l'aide !important sur les hérité le style des forces héritées de style pour être utilisé, si vous voulez remplacer les hérité de style, alors vous pouvez simplement ajouter !important pour la poste.css

    //default.css
.color {
   color: blue !important;
}

//posts.css
.color {
   color: green !important;
}
//In this example the colour would be green.

    Maintenant les deux sont considérés comme importants et le dernier sera utilisé.

    InformationsquelleAutor Kingsley Ijomah