Il CSS "sfondo"La proprietà viene utilizzata per controllare lo sfondo di un elemento dichiarato. Allo stesso tempo, ci sono varie proprietà che compongono lo sfondo, tra cui "colore di sfondo","immagine di sfondo","Size di sfondo", e molti altri. Lo sfondo copre la dimensione totale dell'elemento, incluso il bordo e l'imbottitura, ma esclude il margine. Rende il testo così visibile e facile da leggere per l'utente. Inoltre, il "colore di sfondo" determina il colore sul retro dell'elemento o dei dati definiti.

Questo post spiegherà quanto segue:

• Qual è la proprietà "Background" CSS?
• Qual è la differenza tra "background: nessuno" vs "background: trasparente"?

Qual è la proprietà "Background" CSS?

IL "sfondo"La proprietà è una proprietà shorthand in CSS utilizzata per impostare lo sfondo di qualsiasi elemento sotto forma di un'immagine, un paragrafo o qualsiasi tipo di elemento nel documento HTML. Ci stanno seguendo le proprietà di sfondo composte da altre otto proprietà:

• "immagine di sfondo"È utilizzato per l'impostazione di una o più immagini sul retro dell'elemento. Un'immagine di sfondo appare per impostazione predefinita nell'angolo in alto a sinistra di una pagina HTML.
• IL "Ripeat di sfondo"L'attributo specifica se l'immagine di sfondo verrà ripetuta o meno. Un'immagine di sfondo è ripetitiva sia orizzontalmente che verticalmente per impostazione predefinita.
• "attacco di background"Determina se un'immagine di sfondo a scorrimento deve essere mantenuta sulla pagina HTML o pagine di contenitore aggiuntive.
• "posizione in background"È utilizzato per l'impostazione della posizione dell'elemento.
• "Size di sfondo"Viene utilizzato per allocare la dimensione dell'immagine di sfondo.
• IL "Background-clip"L'attributo specifica la quantità di sfondo di un elemento dovrebbe essere coperto da un'immagine o da un colore.
• "colore di sfondo"Viene utilizzato per allocare il colore sul retro dell'elemento.
• "origine background"Descrive la posizione dell'origine dell'area di posizionamento dello sfondo in un'immagine di sfondo.

Qual è la differenza tra "background: nessuno" vs "background: trasparente"?

Non c'è differenza tra loro. Se non si specifica un valore per eventuali proprietà mezze dozzine per le quali lo sfondo è una scorciatoia, è impostato sul suo valore predefinito, incluso "nessuno" E "trasparente".

Esempio 1: Utilizzo di "Sfondo: nessuno" in CSS

Per impostare il "Background: nessuno"Proprietà in CSS, prima, aggiungi i dati nel documento HTML, quindi accedi all'elemento in CSS e applicalo.

Per un'implicazione pratica, prova le istruzioni fornite.

Passaggio 1: aggiungi i dati nell'intestazione

Ai fini dell'aggiunta di un'intestazione nella pagina HTML, utilizzare il tag di intestazione da "

" A "

". In questo scenario, abbiamo "H1"Per la prima intestazione,"H2"Per la seconda voce e"H3"Per la terza intestazione. Inoltre, incorporare i dati all'interno del testo per l'intestazione:

Sito di tutorial di Linuxhint

Lo sfondo come nessuno

lo sfondo è verde

Produzione

Passaggio 2: Imposta proprietà "None"

Successivamente, accedi all'intestazione utilizzando "H2"Tag e applicare le proprietà sotto l'elenco:

H2
Colore: pomodoro;
Background-color: nessuno;

Qui:

• "colore"La proprietà viene utilizzata per impostare il colore del testo.
• "colore di sfondo"Specifica il colore sul retro dell'elemento. Per fare ciò, qui, il valore di questa proprietà è impostato come "nessuno"Per nessun colore sul retro.

Si può notare che la proprietà del colore imposta il colore del testo. Tuttavia, non c'è colore sul retro dell'elemento:

Passaggio 3: imposta lo sfondo come un colore particolare

Quindi, accedi all'altro intestazione utilizzando il nome dell'intestazione "H3"E applica le stesse proprietà con i valori diversi:

H3
colore bianco;
Background-color: verde;

Per farlo, applicheremo il "colore"Proprietà con il valore come"bianco" e il "colore di sfondo"Proprietà impostata come"verde":

Esempio 2: Utilizzo di "Background: trasparente" in CSS

Per impostare lo sfondo: trasparente in CSS, utilizzare il codice HTML sopra e quindi applicare il “colore di sfondo" COME "trasparente".

Passaggio 1: Imposta "Colore di fondo: trasparente"

Accedi al "H2"Intestazione e applicare le proprietà di frammento fornite:

H2
Colore: RGB (10, 250, 70);
Background-color: trasparente

Per farlo, nello snippet sopra:

• Il valore del "coloreLa proprietà "è impostata come"RGB (10, 250, 70)".
• "colore di sfondo"È impostato come"trasparente".

Passaggio 2: imposta un colore particolare sul retro

Accedi all'intestazione e applica le stesse proprietà con valori diversi:

H3
colore bianco;
Background-color: RGB (236, 169, 91);

Nota: Non c'è differenza tra "background: nessuno" e "background: trasparente" in CSS.

Conclusione

Non c'è differenza tra "Background: nessuno" E "Background: trasparente". IL "Background-color: nessuno"Non imposta colore sul retro dell'elemento. D'altra parte, se hai specificato un colore sul retro dell'elemento, "Background-color: trasparente", Specificare che il colore di sfondo dovrebbe essere trasparente nell'elemento definito. Questo post ha dimostrato la differenza tra la proprietà di fondo con il valore nessuno e trasparente.