CSS Unset
In questo tutorial, utilizzeremo questo valore non stabilito nel nostro codice CSS e presenteremo come funziona. Esploreremo esempi in cui applichiamo alcune proprietà e quindi utilizziamo "Unset" per le proprietà annullate o annullate."
Esempio 1
Inizieremo a scrivere HTML creando un nuovo file nel codice Visual Studio e scegliendo HTML come lingua. Il file è stato generato e tutto ciò che dobbiamo fare ora è aggiungere "!"Mark per ottenere i tag di base. Di conseguenza, la pressione di "Invio" fa sì che il file mostri tutti i tag di base dell'HTML. Il corpo è la sezione da dove iniziamo la codifica. Abbiamo semplicemente messo una voce "H1" e un paragrafo "P" nel corpo. Forniamo anche un collegamento al file CSS all'interno della "testa" in questo modello HTML. Guarda come funziona questo valore inserito in CSS.
Stiamo per modellare sia l'intestazione che il paragrafo. Abbiamo impostato prima l'intestazione "Font-Family" e stiamo selezionando "Calibri" per questo. Cambiamo anche il suo "colore", e fissiamo "rosso" per questo. Ora abbiamo anche un paragrafo, e qui cambiamo il "colore" del paragrafo. Ora, vogliamo annullare il colore del paragrafo. Quindi, per questo, utilizziamo il valore "unset" per il "colore" del paragrafo, quindi questo colore "verde" non viene applicato al testo del paragrafo.
L'output mostra che il colore dell'intestazione e la famiglia dei caratteri sono cambiati, ma il colore del paragrafo rimane invariato. Qui puoi vedere che il colore verde non viene applicato qui al testo del paragrafo perché inseriamo la proprietà del colore del paragrafo.
Esempio 2
Stiamo utilizzando lo stesso codice HTML qui che abbiamo creato nel nostro esempio precedente. Accogliamo l'intestazione utilizzando due proprietà. Uno di questi è la proprietà "Font-Family" e abbiamo impostato questa proprietà come "algerina."La seconda proprietà che stiamo usando qui per l'intestazione è la proprietà" Color "e usiamo" Blue "qui. Applichiamo anche più proprietà al paragrafo qui. Il "colore" di questo paragrafo è "verde" e la dimensione del carattere del paragrafo è "24px". Usiamo anche il "Times New Roman" come "Font-Family."Utilizziamo la proprietà" Decorazione del testo "per generare la sottolineatura per l'intestazione. Abbiamo impostato il valore di "decorazione del testo" come "sottolinea."
Ora stiamo usando la parola chiave "audace" per il "font-peso" e allineando questo paragrafo nel "centro" utilizzando la proprietà "allineate al testo". Ma ora, non vogliamo applicare tutte queste proprietà al nostro paragrafo, quindi invece di scrivere tutte le proprietà separatamente e quindi usare il valore "unlet" su ciascuna proprietà, abbiamo semplicemente messo "tutto" e impostiamo il suo valore su "Unset" per il paragrafo. Il nostro paragrafo rimarrà invariato e nessuna proprietà o styling verrà applicata al paragrafo.
La famiglia del colore e dei caratteri dell'intestazione è stata cambiata, mentre il paragrafo è rimasto invariato. Perché tutte le proprietà che abbiamo applicato al paragrafo sono state inserite utilizzando "All: Unset" in CSS.
Esempio 3
In questo codice HTML dato, ne metteremo un'intestazione e un div qui e ci passeremo al CSS per applicare lo stile su di essi e annullare o sconfiggere alcuni stili usando "Unset."
Appliciamo solo alcune proprietà sul div. Qui, abbiamo impostato la sua "dimensione del carattere" e mettiamo il valore della "dimensione del carattere" come "24px". Utilizziamo anche "audace" per il "carattere del carattere."Il" colore "che scegliamo qui per questo div è" rosso "e la" famiglia di carattere "che stiamo selezionando qui è" Arial."Ora, non abbiamo bisogno di cambiare il" colore "e" font-peso "di questo Div Quindi, abbiamo semplicemente messo queste due proprietà all'interno delle parentesi graffe di Div Curly e posizionare" Unset "per entrambi. Le proprietà rimanenti si applicheranno all'elemento Div, ma le proprietà del colore e del carattere non si applicheranno al Div mentre inseriamo queste proprietà qui.
L'output si rende qui e puoi vedere che la "famiglie font" e "dimensioni dei caratteri" sono cambiate qui in base ai valori che abbiamo impostato nel codice CSS, ma non vi è alcun effetto sul "font-weight" e "colore" del div. Questo perché inseriamo questi valori. In questo modo, possiamo annullare alcune proprietà utilizzando il nome della proprietà e impostare il valore "Unset" per questa proprietà.
Esempio 4
Ne metteremo una direzione qui e poi metteremo un paragrafo; Dopo questo paragrafo, abbiamo anche messo un elemento Div qui e alla fine posizioniamo un elemento di span. Stiamo per modellare tutti questi e poi inserirli tutti in CSS. Guarda il file CSS e guarda come faremo questo.
L'intestazione "Font-Family" è la prima proprietà che abbiamo impostato e scegliamo "Algerian" per questo. Regoliamo anche il suo "colore", che abbiamo impostato su "viola" e "centrale" anche questa intestazione, utilizzando il "align del testo."Ora abbiamo un paragrafo e tutto ciò che dobbiamo fare è cambiare il" colore "del paragrafo. Il valore dell'attributo "colore" è impostato su "verde" in questo caso. La "dimensione del carattere" qui è "24px". Come proprietà "caramella", utilizziamo anche "Times New Roman."L'attributo" decorazione del testo "viene utilizzato per creare la sottolineatura del testo. Il valore di "decorazione del testo" è stato impostato su "sottolineare."Ora stiamo usando la parola chiave" audace "per la proprietà" font-weight "e la proprietà" allineate al testo "per posizionare questo paragrafo nel" centro."
Ora, per il Div, stiamo utilizzando le stesse proprietà ma cambiando i valori di queste proprietà qui. In questa situazione, il valore dell'attributo "colore" è "rosso."La" dimensione del carattere "è" 22px "in questo caso. Usiamo anche "Calibri" come proprietà "Font-Family". Il valore per la "delerazione del testo" è stato modificato in "sottolinea."Per mettere questo Div nel mezzo, stiamo usando la proprietà" allineate al testo "e impostalo come" Centro."
Dopo questo, abbiamo Span, "Blue" è il valore della proprietà "Colore" di Span. In questo caso, la "dimensione del carattere" è "20px". "Cambria" è anche impostato qui come valore della proprietà "Font-Family". Cambiamo anche lo "tipo di carattere" di questo intervallo in "corsivo."Il valore di" decorazione del testo "che stiamo usando qui è" sottolinea."Ti mostreremo come apparirà quando tutte le proprietà si applicheranno e anche quando nessuna proprietà si applicherà a loro. Ti mostreremo due output qui in modo da imparerai facilmente la differenza prima di usare "Unset" e dopo aver utilizzato il valore "unset" per le proprietà "tutte".
Guarda questo primo output qui; Tutte le proprietà sono applicate al titolo, al paragrafo, al div e alla durata perché non usiamo "nont" qui con alcuna proprietà. Ora, vai avanti e controlla come mostrerà l'output quando usiamo "Unset."
In questo file CSS, aggiungiamo semplicemente "tutto: unset" per l'intestazione, il paragrafo, il div e lo span. Significa che "inseriamo" tutte le proprietà che abbiamo fatto domanda per tutte loro.
L'output mostra che non vi è alcuna proprietà applicata su alcuna intestazione, paragrafo, div e elemento span. Questo è solo a causa del valore "nont" che abbiamo usato per "tutti."
Conclusione
Questo tutorial è stato sviluppato per aiutarti a imparare il valore "nont" CSS che ci consente di annullare alcune proprietà e annullare anche tutte le proprietà semplicemente posizionando questo "nont" lì. Questo tutorial ha superato questo argomento in dettaglio. Abbiamo superato quattro diversi esempi qui in cui abbiamo utilizzato questo valore "non impossibile", così come gli output, quindi capirai facilmente come funziona questo valore "nont". Abbiamo usato il valore "nont" separatamente dai nomi delle proprietà e abbiamo anche usato questo con la proprietà "tutto" che ha annullato tutte le proprietà che abbiamo applicato negli esempi. Spero che sarai in grado di sconfiggere le tue proprietà in CSS dopo aver seguito correttamente questo tutorial.