Wie stellen CSS-Attribute-Werte für ein bestimmtes Element auf Standard (oder Vererbung verhindern)

Question

beliebiges HTML-Element gegeben, dass ein Kind von einem anderen Elemente ist und eine Reihe von CSS automatisch erben Attribute: wie man ein Set (oder alle) dieser Attribute auf den Standardwert?

Beispiel:

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> 

hier von Browser-default Ich meine, ich will es genau so aussehen, als ob kein CSS überhaupt war auf dieses Element angewendet.

Hier verwende ich ein input Element als ein Beispiel, aber ich spreche über jede Art von Element. Ich bin nicht zu fragen, wie auf dieses spezielle Element verschiedene CSS-Attribute zu setzen, ich frage, wie man es auf die Standardwerte zurückgesetzt .

Verschiedene Elemente haben unterschiedliche Standardattribute wie padding, wenn sie nicht gesetzt sind. Beispiel: Ein button mit einem Padding von 0 in CSS umschließt seinen Text ohne Leerzeichen. Sie können später das Padding auf einen anderen Wert setzen, aber wie würden Sie es auf das Standard-Padding setzen?

Vielen Dank im Voraus für alle Kommentare!

Answer 1

Wenn Sie über die Standardeinstellungen des Browsers sprechen, sehen Sie sich CSS-Reset-Stylesheets an, die im gesamten Web verfügbar sind. Diese Stylesheets setzen die Eigenschaften jedes Elements auf einen standardisierten Wert zurück.

Ein paar Beispiele

Meyer Web

HTML5 Doctor (CSS-Reset Mit HTML5-Elemente enthalten)

Wenn Sie die manuelle Stil setzt sagen und Vererbung ignorieren, als bisher, gibt es keine Möglichkeit, die Stile zurücksetzen vollständig, es sei denn, und bis Sie ihre Werte so wieder deklarieren, zum Beispiel

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 */ 
} 

Answer 2

Sie können nicht t Setzen Sie ein Attribut auf den Standardwert, da die Standardeinstellungen browserabhängig sind und in CSS nicht referenziert werden können. Vgl. zu How to set CSS attributes to default values for a specific element (or prevent inheritance)

Auf der anderen Seite, Ihr Beispiel wird padding und margin, die nicht geerbt ist. Die Frage scheint also zu sein, wie Sie verhindern können, dass Ihre eigene CSS-Regel auf ein bestimmtes Element angewendet wird. Dann lautet die Antwort, dass Sie den Selektor der Regel ändern müssen, damit das spezifische Element nicht zu ihm passt. In Ihrem Fall könnte dies durch eine Änderung der Wahlschalter auf

.navigation > input 

Aber je komplizierter das Markup und das Stylesheet ist, desto schwieriger ist es, die Auswirkungen auf diese Weise beschränken wird getan werden.

Answer 3

in Ihrem Fall können Sie verwenden:

.navigation input {  
    all: initial; 
} 

es werden alle attibutes Ihrer Eingabe auf den Anfangswert zurück.

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

Answer 4

Sie ungesetzt verwenden können, sagen Sie Grenze Farbe Standard-Browser

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

dies unset den Stil geerbt von anderen Klassen festlegen möchten.