CSS Unset
I denne opplæringen vil vi bruke denne usettverdien i vår CSS -kode og presentere hvordan den fungerer. Vi vil utforske eksempler der vi bruker noen egenskaper og deretter bruker "unset" for å avbryte eller angre egenskaper.”
Eksempel 1
Vi begynner å skrive HTML ved å lage en ny fil i Visual Studio Code og velge HTML som språket. Filen er generert, og alt vi trenger å gjøre nå er å legge til "!”Merk for å få de grunnleggende kodene. Som et resultat får det å trykke på "Enter" filen til å vise alle HTMLs grunnleggende tagger. Kroppen er seksjonen der vi begynner å kode. Vi setter ganske enkelt en overskrift “H1” og ett avsnitt “P” i kroppen. Vi gir også en lenke til CSS -filen i "hodet" i denne HTML -malen. Se på hvordan denne ikke -settverdien fungerer i CSS.
Vi kommer til å style både overskriften og avsnittet. Vi setter overskriften "font-family" først, og vi velger "calibri" for dette. Vi endrer også dens "farge", og vi satte "rød" for dette. Nå har vi også et avsnitt, og her endrer vi bare "fargen" på avsnittet. Nå vil vi angre fargen på avsnittet. Så for dette bruker vi "usett" verdien for "fargen" på avsnittet, så denne "grønne" fargen blir ikke brukt på avsnittet.
Utgangen viser at overskriftens farge og skriftfamilie endres, men fargen på avsnittet forblir uendret. Her kan du se at den grønne fargen ikke blir brukt her på avsnittets teks.
Eksempel 2
Vi bruker den samme HTML -koden her som vi har laget i vårt forrige eksempel. Vi styler overskriften ved å bruke to egenskaper. En av dem er eiendommen "font-family", og vi setter denne eiendommen som "algerisk.”Den andre egenskapen vi bruker her for overskriften er“ farge ”-egenskapen, og vi bruker“ blå ”her. Vi bruker også flere egenskaper på avsnittet her. "Fargen" på dette avsnittet er "grønn", og størrelsen på avsnittets skrift er "24px". Vi bruker også "Times New Roman" som "Font-Family.”Vi bruker egenskapen“ tekstdekorasjon ”for å generere understreken for overskriften. Vi setter verdien "tekstdekorasjon" som "understreker.”
Nå bruker vi det "dristige" nøkkelordet for "fontvekt" og justerer dette avsnittet i "senteret" ved å bruke egenskapen "tekst-align". Men nå ønsker vi ikke å anvende alle disse egenskapene på vårt avsnitt, så i stedet for å skrive alle egenskaper hver for seg og deretter bruke "useset" -verdien på hver egenskap, legger vi bare "alle" og setter verdien til "useset" for avsnittet. Avsnittet vårt vil forbli uendret, og ingen eiendom eller styling vil bli brukt på avsnittet.
Familien og fontfamilien til overskriften er endret, mens avsnittet har holdt seg uendret. Fordi alle egenskapene vi har brukt på avsnittet har vært usikret ved å bruke “All: Unset” i CSS.
Eksempel 3
I denne gitte HTML -koden skal vi legge en overskrift og en div her og flytte til CSS for å bruke stil på dem og avbryte eller fjerne noen stiler ved å bruke “Unset.”
Vi bruker bare noen egenskaper på Div. Her setter vi "fontstørrelse" og satte verdien av "fontstørrelsen" som "24px". Vi bruker også "fet" for "fontvekt."" Fargen "vi velger her for denne diven er" rød ", og" font-family "vi velger her er" Arial.”Nå, vi trenger ikke å endre“ fargen ”og“ fontvekt ”av denne diven, så vi legger bare disse to egenskapene inne i Div krøllete seler og plasserer" usett "for begge. De gjenværende egenskapene vil gjelde for DIV-elementet, men fargen og fontvektegenskapene vil ikke gjelde for Div, da vi tar avvirkning av disse egenskapene her.
Utgangen gjengis her, og du kan se at "font-family" og "fontstørrelse" endres her i henhold til verdiene vi har satt i CSS-koden, men det er ingen effekt på "fontvekt" og "farge" av diven. Dette er fordi vi løsner disse verdiene. På denne måten kan vi fjerne noen egenskaper ved å bruke eiendomsnavnet og sette verdien “usett” for denne egenskapen.
Eksempel 4
Vi kommer til å plassere en overskrift her og deretter legge et avsnitt; Etter dette avsnittet legger vi også et divelement her, og på slutten plasserer vi et spennelement. Vi kommer til å style alle disse og deretter fjerne dem alle i CSS. Se på CSS -filen og se hvordan vi vil gjøre dette.
Overskriften "font-family" er den første eiendommen vi setter, og vi velger "algerisk" for den. Vi justerer også den.”Vi har nå et avsnitt, og alt vi må gjøre er å endre" fargen "i avsnittet. Verdien av "farge" -attributtet er satt til "grønn" i dette tilfellet. "Font-size" her er "24px". Som en "font-family" -egenskap bruker vi også "Times New Roman.”Attributtet“ tekst-dekorasjon ”brukes til å lage tekstenes understrek. "Tekstdekorasjon" -verdien ble satt til å "understreke.”Vi bruker nå det" dristige "nøkkelordet for" fontvekt "og" tekst-align "-egenskapen for å plassere dette avsnittet i" senteret.”
Nå, for div, bruker vi de samme egenskapene, men endrer verdiene til disse egenskapene her. I denne situasjonen er verdien av "farge" -attributtet "rød.”“ Font-size ”er“ 22px ”i dette tilfellet. Vi bruker også "Calibri" som en "font-family" -egenskap. Verdien for "tekstdekorasjon" ble endret til "understrek.”For å sette denne diven i midten, bruker vi den“ tekst-align ”egenskapen og setter den som“ Center.”
Etter dette har vi spenn, "blå" er verdien av "fargen" -egenskapen til spennet. I dette tilfellet er "fontstørrelse" "20px". “Cambria” er også satt her som en verdi av "Font-Family" -egenskaper. Vi endrer også "fontstil" i dette spennet til "kursiv.”" Tekstdekorasjonsverdien vi bruker her er "Understreke.”Vi vil vise deg hvordan det vil se ut når alle eiendommer gjelder dem, og også når ingen eiendommer vil gjelde for dem. Vi vil vise deg to utganger her, slik at du enkelt lærer forskjellen før du bruker "usett" og etter å ha brukt "usett" verdien for "alle" egenskaper.
Se på denne første utgangen her; Alle egenskapene brukes på overskriften, avsnitt, div og spenn fordi vi ikke bruker "usett" her med noen eiendom. Gå nå videre og sjekk hvordan den vil vise utdataene når vi bruker “Unset.”
I denne CSS -filen legger vi bare til “All: Unset” for overskriften, avsnitt, div og spenn. Det betyr at vi "ikke set" alle egenskapene som vi har søkt om dem alle.
Utgangen viser deg at det ikke er noen eiendom som er brukt på noen overskrift, avsnitt, div og spennelement. Dette er bare på grunn av den "usikten" verdien som vi har brukt for “alle.”
Konklusjon
Denne opplæringen ble utviklet for å hjelpe deg med å lære CSS “Unset” -verdien som lar oss angre noen egenskaper og også angre alle egenskaper ved å bare plassere denne "usett" der. Denne opplæringen har gått gjennom dette emnet i detalj. Vi gikk over fire forskjellige eksempler her der vi har brukt denne "usett" verdien, så vel som utgangene, så du vil lett forstå hvordan denne "usett" -verdien fungerer. Vi har brukt "useset" verdien separat fra eiendomsnavnene og brukt dette med "alle" egenskapen som kansellerte alle egenskapene som vi har brukt i eksemplene. Jeg håper du vil kunne fjerne egenskapene dine i CSS etter riktig å følge denne opplæringen.