Comment définir les attributs CSS sur les valeurs par défaut pour un élément spécifique (ou empêcher l'héritage)

Donné à n'importe quel élément HTML qui est un enfant d'un autre élément et est automatiquement hérite d'une série d'attributs CSS: comment pouvez-vous définir un (ou l'ensemble) de ces attributs à la valeur par défaut?

Exemple:

CSS:

.navigation input {
    padding: 0;
    margin: 0 30em;
}

HTML

<div class="navigation">
    Some text: <input type="text" name="one" />
    More text: <input type="text" name="two" />
    <!-- The next input, I want it to be as browser-default -->
    <div class="child">
        <input type="text" name="three">
    </div>
</div>

Ici, par navigateur par défaut je veux dire, je veux qu'il soit exactement comme si le CSS a été appliquée à cet élément.

Ici, je suis en utilisant un input élément comme un exemple, mais je parle de tout type d'élément. Je ne demande pas comment définir différents attributs CSS à cet élément, je me demande comment réinitialiser à ses valeurs par défaut.

Des différents éléments différents attributs par défaut comme padding quand ils ne sont pas définies. Par exemple, un button qui a un rembourrage de 0 dans les CSS s'envelopper son texte sans espace. Vous pouvez plus tard, son rembourrage à une autre valeur, mais comment vous le définissez la valeur par défaut de rembourrage?

Merci d'avance pour tous les commentaires!

source d'informationauteur Francisco Zarabozo

  1. 2

    Si vous dites à propos du navigateur par défaut de regarder reset CSS les feuilles de style, ils sont tous sur le web, les feuilles de style de réinitialisation de chacun des éléments des propriétés pour une valeur normalisée.

    Quelques Exemples

    Meyer Web

    HTML5 Médecin (CSS Reset Avec des Éléments HTML5 Inclus)

    Si vous dites le manuel de style réinitialise et d'ignorer l'héritage, que jusqu'à maintenant, il n'y a aucun moyen de réinitialiser les styles complètement à moins que et jusqu'à ce que vous re-déclarer leurs valeurs ainsi, par exemple

    div {
   color: red;
   font-family: Arial;
}

div p {
   /* Here it will inherit the parents child unless and 
      until you re specify properties with different values */
}
  2. 9

    dans votre cas, vous pouvez utiliser :

    .navigation input {    
    all: initial;
}

    il reviendra tous les attribue de votre entrée à la valeur initiale.

    source :
    http://www.w3schools.com/cssref/css3_pr_all.asp

  3. 1

    Vous ne pouvez pas définir un attribut à la valeur par défaut, car les paramètres par défaut du navigateur-dépendant et ne peut pas être mentionné dans les CSS. Cf. pour Comment définir les attributs CSS pour les valeurs par défaut d'un élément spécifique (ou empêcher l'héritage)

    D'autre part, votre exemple définit padding et marginqui sont pas hérité. Donc, la question semble être de savoir comment empêcher votre propre règle CSS à partir de l'application de certains éléments spécifiques. Alors la réponse est que vous avez besoin de modifier le sélecteur de la règle, de sorte que l'élément spécifique ne correspondent pas. Dans votre cas, cela peut être fait en changeant le sélecteur de

    .navigation > input

    Mais le plus compliqué, le balisage et les feuilles de style sont, le plus il devient difficile de limiter les effets de cette façon.

  4. 0

    CSS 4 CR a une disposition pour la revert mot-clé pour les valeurs. Il ressemble prévu pour la fin exacte de la question et peut être utilisée comme ceci:

    .navigation input {    
    all: revert;
}

    Encore son prise en charge du navigateur n'est pas très impressionnant pour le temps de l'écriture...

  5. -1

    Vous pouvez utiliser unset,
    dites que vous voulez définir la couleur de la bordure pour le navigateur par défaut

    .navigation input {
    padding: 0;
    margin: 0 30em;
    border-color: unset;
}

    cela va désactiver le style hérité des autres classes.