background: none vs background: transparent qual è la differenza?

C'è una differenza tra queste due proprietà CSS:

background: none;
background: transparent;

1. Sono entrambi validi?
2. Quale dovrebbe essere usato e perché?

Non c'è differenza tra loro.

Se non specifichi un valore per nessuna delle mezza dozzina di proprietà che backgroundè un'abbreviazione per, allora viene impostato sul suo valore predefinito. nonee transparentsono le impostazioni predefinite.

Uno imposta esplicitamente il background-imagea nonee imposta implicitamente il background-colora transparent. L'altro è il contrario.

Come informazioni aggiuntive sulla risposta di @Quentin , e come dice giustamente, la backgroundproprietà CSS stessa, è una scorciatoia per:

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

Ciò significa che puoi raggruppare tutti gli stili in uno, come:

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

Questo sarebbe (in questo esempio):

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

Quindi ... quando imposti: background:none;
stai dicendo che tutte le proprietà dello sfondo sono impostate su nessuno ...
Stai dicendo questo background-image: none;e tutte le altre allo initialstato (poiché non vengono dichiarate).
Quindi background:none;è:

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

Ora, quando definisci solo il colore (nel tuo caso transparent), in pratica stai dicendo:

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

Ripeto, come dice giustamente @Quentin, i valori default transparente in questo caso sono gli stessi, quindi nel tuo esempio e per la tua domanda originale, No, non c'è differenza tra loro.none

Ma! .. se dici background:noneVs background:redallora sì ... c'è una grande differenza, come ho detto, il primo imposterebbe tutte le proprietà a none/defaulte il secondo, cambierà solo il colore rimarrà il resto nel suo defaultstato.

Quindi in breve:

Risposta breve : No, non c'è alcuna differenza (nel tuo esempio e nella domanda originale)
Risposta lunga : Sì, c'è una grande differenza, ma dipende direttamente dalle proprietà assegnate all'attributo.

Upd1: valore iniziale (aka default)

Valore iniziale la concatenazione dei valori iniziali delle sue proprietà a mano:

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

Vedi più backgrounddescrizioni qui

Upd2: chiarire meglio le background:none;specifiche.

Per completare le altre risposte: se vuoi ripristinare tutte le proprietà dello sfondo al loro valore iniziale (che include background-color: transparente background-image: none) senza specificare esplicitamente alcun valore come transparento none, puoi farlo scrivendo:

background: initial;