Heim > Web-Frontend > CSS-Tutorial > Was ist der Hauptunterschied zwischen „all: unset' und „all: revert' in CSS?

Was ist der Hauptunterschied zwischen „all: unset' und „all: revert' in CSS?

Barbara Streisand
Freigeben: 2024-11-16 12:03:03
Original
906 Leute haben es durchsucht
<p>What is the Key Difference Between `all: unset` and `all: revert` in CSS?

<p>Den Unterschied zwischen all: unset und all: revert in CSS verstehen

<p>Das Schlüsselwort unset in CSS hilft dabei, eine Eigenschaft auf ihren geerbten Wert zurückzusetzen wenn es von seinem übergeordneten Element erbt, und auf seinen Anfangswert, wenn es nicht erbt. Dies bedeutet, dass es sich im ersten Fall wie das Schlüsselwort „inherit“ und im zweiten Fall wie das Schlüsselwort „initial“ verhält.

<p>Andererseits verfolgt das Schlüsselwort „revert“ einen etwas anderen Ansatz. Es setzt den kaskadierten Wert der Eigenschaft von ihrem aktuellen Wert auf den Wert zurück, den er gehabt hätte, wenn vom aktuellen Stilursprung keine Änderungen am aktuellen Element vorgenommen worden wären.

<p>Lassen Sie uns nun auf den in hervorgehobenen Unterschied eingehen das bereitgestellte Zitat von MDN:

<p>Browser und benutzerdefinierte Stylesheets

<p>Der Hauptunterschied zwischen unset und revert liegt in der Behandlung von Eigenschaften, deren Werte vom Browser oder von festgelegt wurden Von Benutzern erstellte benutzerdefinierte Stylesheets (auf der Browserseite festgelegt).

<p>Bei Verwendung von all: unset werden die vom Browser oder vom Benutzer festgelegten Werte für Eigenschaften durch die geerbten oder anfänglichen Werte ersetzt. Im Gegensatz dazu ist all:revert einzigartig in seiner Fähigkeit, bestimmte Eigenschaften auf den Zustand vor dem Eingreifen des Browsers oder der Benutzer-Stylesheets zurückzusetzen.

<p>Beispiel

<p>Bedenken Sie das folgende CSS-Snippet :

p {
  margin: 50px;
}
Nach dem Login kopieren
<p>Angenommen, dieser Browser wendet diesen Standard-Randstil auf alle <p>-Seiten an. Elemente. Wenn wir nun Folgendes verwenden:

<p>
Nach dem Login kopieren
Nach dem Login kopieren
<p>Die Randeigenschaft kehrt in ihren ursprünglichen Zustand zurück, als ob der Browser seinen Standardstil nicht angewendet hätte.

<p>Allerdings mit:

<p>
Nach dem Login kopieren
Nach dem Login kopieren
<p>setzt den Rand auf seinen geerbten Wert zurück, der normalerweise 0 wäre. In diesem Fall wird also durch „unset“ nicht der ursprüngliche vom Browser festgelegte Rand wiederhergestellt, während „revert“ dies tut.

<p>In Fazit: all: unset konzentriert sich auf das Zurücksetzen von Eigenschaften auf ihre geerbten oder anfänglichen Werte, während all: revert den Schwerpunkt auf die Wiederherstellung von Eigenschaften auf ihren ursprünglichen Zustand vor jeglichen Browser- oder Benutzer-Stylesheet-Änderungen legt.

Das obige ist der detaillierte Inhalt vonWas ist der Hauptunterschied zwischen „all: unset' und „all: revert' in CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage