it-swarm.com.de

Hintergrund: keine vs Hintergrund: transparent Was ist der Unterschied?

Gibt es einen nterschied zwischen diesen beiden CSS-Eigenschaften:

background: none;
background: transparent;
  1. Sind beide gültig?
  2. Welches sollte verwendet werden und warum?
108
web-tiki

Es gibt keinen Unterschied zwischen ihnen.

Wenn Sie keinen Wert für eine der sechs Eigenschaften angeben, für die background eine Kurzform ist, wird der Standardwert verwendet. none und transparent sind die Standardeinstellungen.

Man setzt explizit das background-image zu none und setzt implizit den background-color bis transparent. Der andere ist umgekehrt.

103
Quentin

Als zusätzliche Information zu @ Quentin antworten, und wie er zu Recht sagt, ist die CSS-Eigenschaft background selbst eine Abkürzung für:

background-color
background-image
background-repeat
background-attachment
background-position

Das heißt, Sie können alle Stile in einem gruppieren, wie zum Beispiel:

background: red url(../img.jpg) 0 0 no-repeat fixed;

Dies wäre (in diesem Beispiel):

background-color: red;
background-image: url(../img.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 0 0;

Also ... wenn Sie einstellen: background:none;
sie sagen, dass alle Hintergrundeigenschaften auf none gesetzt sind ...
Sie sagen, dass background-image: none; Und alle anderen in den Zustand initial versetzt werden (da sie nicht deklariert werden).
Also ist background:none;:

background-color: initial;
background-image: none;
background-repeat: initial;
background-attachment: initial;
background-position: initial;

Wenn Sie nur die Farbe definieren (in Ihrem Fall transparent), dann sagen Sie im Grunde:

background-color: transparent;
background-image: initial;
background-repeat: initial;
background-attachment: initial;
background-position: initial;

Ich wiederhole, wie @Quentin zu Recht sagt die Werte defaulttransparent und none in diesem Fall sind die gleichen, also gibt es in Ihrem Beispiel und für Ihre ursprüngliche Frage, Nein, keinen Unterschied zwischen ihnen.

Aber! .. wenn Sie background:none Vs background:red Sagen, dann ja ... es gibt einen großen Unterschied, wie ich sage, der erste würde alle Eigenschaften auf none/default Und der zweite setzen Erstens wird nur die color geändert und der Rest verbleibt in seinem default - Status.

Also in Kürze:

Kurze Antwort : Nein, es gibt überhaupt keinen Unterschied (in Ihrem Beispiel und Ihrer ursprünglichen Frage)
Lange Antwort : Ja, es gibt einen großen Unterschied, der jedoch direkt von den Eigenschaften abhängt, die Attributen zugewiesen wurden.


Upd1: Anfangswert (auch bekannt als default)

Anfangswert Die Verkettung der Anfangswerte seiner Langzeiteigenschaften:

background-image: none
background-position: 0% 0%
background-size: auto auto
background-repeat: repeat
background-Origin: padding-box
background-style: is itself a shorthand, its initial value is the concatenation of its own longhand properties
background-clip: border-box
background-color: transparent

Weitere Beschreibungen zu backgroundhier


Upd2: Klären Sie die background:none; - Spezifikation besser ab.

61
gmo

Ergänzend zu den anderen Antworten: Wenn Sie alle Hintergrundeigenschaften auf ihren ursprünglichen Wert zurücksetzen möchten (einschließlich background-color: transparent und background-image: none) ohne explizite Angabe eines Wertes wie transparent oder none, können Sie dies tun, indem Sie Folgendes schreiben:

background: initial;
7
herman