Wie kann ich die CSS-Eigenschaft aufheben?

109

Grundsätzlich habe ich zwei externe CSS auf meiner Seite.

Die erste Main.cssenthält alle Stilregeln, aber ich habe keinen Zugriff darauf und kann sie daher nicht ändern. Ich habe Zugriff auf eine zweite Datei Template.css, daher muss ich die Main.cssWerte in überschreiben template.css.

Dies ist einfach, für die ich den Wert ändern muss, aber wie entferne ich eine Eigenschaft vollständig?

Wie sagen , eine Klasse .c1hat height: 40px;, wie kann ich von dieser Höhe Eigentum loswerden?

Bluemagica
quelle

Antworten:

175

Sie müssen jede einzelne Eigenschaft auf ihren Standardwert zurücksetzen. Es ist nicht großartig, aber es ist der einzige Weg, angesichts der Informationen, die Sie uns gegeben haben.

In Ihrem Beispiel würden Sie Folgendes tun:

.c1 {
    height: auto;
}

Sie sollten hier nach jeder Immobilie suchen:

https://developer.mozilla.org/en-US/docs/Web/CSS/Reference

Zum Beispielheight :

Ursprünglicher Wert : auto

Ein weiteres Beispielmax-height :

Ursprünglicher Wert : none


Im Jahr 2017 gibt es jetzt einen anderen Weg, das unsetSchlüsselwort:

.c1 {
    height: unset;
}

Einige Dokumentationen: https://developer.mozilla.org/en-US/docs/Web/CSS/unset

Das nicht gesetzte CSS-Schlüsselwort ist die Kombination aus dem anfänglichen und dem geerbten Schlüsselwort. Wie diese beiden anderen CSS-weiten Schlüsselwörter kann es auf jede CSS-Eigenschaft angewendet werden, einschließlich der CSS-Kurzform all. Dieses Schlüsselwort setzt die Eigenschaft auf ihren geerbten Wert zurück, wenn sie von ihrem übergeordneten Wert erbt, oder auf ihren Anfangswert, wenn nicht. Mit anderen Worten, es verhält sich im ersten Fall wie das geerbte Schlüsselwort und im zweiten Fall wie das ursprüngliche Schlüsselwort.

Die Browserunterstützung ist gut: http://caniuse.com/css-unset-value

dreißig Punkte
quelle
3
+1 für die nette Antwort und Referenz. Ich denke, der Link hat sich geändert zu: developer.mozilla.org/en-US/docs/Web/CSS/Reference
Paolo
Das Setzen des Werts auf auto scheint nicht zu funktionieren, wenn kein Anfangswert vorhanden ist ("Anfangswert: keiner"). Zum Beispiel, wenn Sie "max-width: auto;" Ich erhalte einen nicht übereinstimmenden Eigenschaftswertfehler. Was soll ich machen?
user1779563
3
@ user1779563 Sie setzen es auf "keine".
AndreKR
1
Ich möchte @simhumileco für seine Antwort danken , die ich schamlos gestohlen habe, da meine Antwort akzeptiert wird und die Leute möglicherweise nicht nach unten scrollen.
dreißig Punkte
10
.c1 {
    height: unset;
}

Der unsetMehrwert in CSS3 löst auch dieses Problem und ist eine noch universellere Methode als autooder,initial weil für jede CSS-Eigenschaft der Standardwert und zusätzlich das Standardverhalten relativ zum übergeordneten Element festgelegt wird.

Beachten Sie, dass der initialWert das oben genannte Verhalten verletzt.

Von MDN :

Wie diese beiden anderen CSS-weiten Schlüsselwörter kann es auf jede CSS-Eigenschaft angewendet werden, einschließlich der CSS-Kurzform all . Dieses Schlüsselwort setzt die Eigenschaft auf ihren geerbten Wert zurück, wenn sie von ihrem übergeordneten Wert erbt, oder auf ihren Anfangswert, wenn nicht.

simhumileco
quelle
9

Wie gesagt, eine Klasse .c1 hat eine Höhe: 40px; Wie werde ich diese Höheneigenschaft los?

Das kannst du leider nicht. CSS hat keinen "Standard" -Platzhalter.

In diesem Fall würden Sie die Eigenschaft mit zurücksetzen

 height: auto;

Wie @Ben richtig hervorhebt, ist dies in einigen Fällen inheritder richtige Weg, beispielsweise beim Zurücksetzen der Textfarbe eines aElements (diese Eigenschaft wird vom übergeordneten Element geerbt):

a { color: inherit }
Pekka
quelle
3
Ich werde dem +1 geben. Es gibt auch den Wert "erben". In einigen anderen Kontexten als der Höhe ist das Erben besser geeignet.
Ben
1
@meo du hast recht. (Verwandte Frage) das scheint zu bedeuten, dass es Eigenschaften gibt, die nicht auf ihre Standardeinstellung im IE zurückgesetzt werden können ... wie schade
Pekka
7

initialIn CSS3 wird ein Schlüsselwort hinzugefügt, damit Autoren diesen Anfangswert explizit angeben können.

RonyK
quelle
Zu Ihrer Information: height:initial;Scheint in IE9 nicht zu funktionieren.
Kris Hollenbeck
Was ist der Unterschied zwischen initialund autound unset?
ExillustX
2

Um die Eigenschaft mit fester Höhe zu entfernen, können Sie sie auf den Standardwert setzen:

height: auto;
Richard H.
quelle
2

Sie müssen einen Selektor mit einer höheren Spezifität als den in bereitstellen Main.css. Stellen Sie mit diesem Selektor die Werte der gewünschten Eigenschaften auf ihre Standardeinstellungen ein, z

body .c1 {
    height: auto;
}

Es gibt keinen "Standard" -Wert, der für alle Eigenschaften funktioniert. Sie müssen den Standardwert für jede Eigenschaft nachschlagen und diesen verwenden.

Jon
quelle
1

Ich hatte ein Problem, das sich selbst beim Überschreiben von "height" auf "unset" oder "initial" anders verhielt als beim Entfernen der vorherigen Einstellung.

Es stellte sich heraus, dass ich auch die Eigenschaft min-height entfernen musste!

height: unset;
min-height: none

Bearbeiten: Ich habe auf IE 7 getestet und es erkennt nicht "nicht gesetzt", so dass "Auto" besser funktioniert ".

Nathalia Xavier
quelle