!Viktig regel i CSS forklart

CSS -egenskapene brukes i en rekkefølge som er definert ved å bruke spesifisitetskonseptet i CSS. Noen ganger kan det hende du må gi betydning for en CSS -egenskaps verdi over de andre verdiene til samme egenskap. For dette, den !Viktig nøkkelord brukes med en CSS -egenskap for å gjøre det mer fremtredende enn andre egenskaper. Denne artikkelen demonstrerer bruken av !Viktig regel i CSS.

Hvordan !Viktige regel fungerer i CSS

For å forstå arbeidet, må du ha en forståelse av syntaksen etterfulgt av !Viktig regel.

De velger refererer til at CSS -velgeren blir brukt mens eiendom refererer til at CSS -egenskapen blir brukt med noen verdi. Plassering av !Viktig nøkkelord betyr også noe, og det må være på slutten av eiendomsverdien som vist i syntaks.

Hvordan å bruke !Viktig regel i CSS

Som !Viktig regel følger ikke spesifisiteten; Dermed spiller det ingen rolle hvor !Viktig regel brukes bare på det høyeste nivået av spesifisitet. La oss ha noen eksempler for å få et tydeligere bilde av dette fenomenet.

Eksempel 1: Bruke ekstern, intern og inline CSS

Vanligvis har Inline CSS høyest prioritet etterfulgt av interne og eksterne CSS. Følgende kode bruker !Viktig regel i et eksternt stilark for å vise sin overordnede oppførsel.

Html

Velkommen til Linuxhint!

I koden ovenfor, en

Element brukes med inline styling som har til hensikt å endre bakgrunnsfargen.

Ekstern CSS

Ovennevnte kode refererer til det eksterne stilarket som vil være koblet til HTML -dokumentet. Det observeres at bakgrunnsfargede egenskaper har en !viktig regel med det.

Intern CSS

Ovennevnte CSS -kode har blitt brukt som en intern CSS; Denne interne CSS prøver også å endre bakgrunnsfargen på

element.

Produksjon

Selv om inline har høyere prioritet enn internt og ekstern. Vi har imidlertid brukt !Viktig nøkkelord med bakgrunnsfargede eiendommer i ekstern CSS. Derfor vil bakgrunnsfargen bli hentet fra den eksterne CSS-filen som kan sees fra output ovenfor.

Eksempel 2: Bruke forskjellige CSS -velgere

Her brukes CSS -velgerne som klasse, og ID for et element. De !Viktig regel brukes inne i klassen til et element.

Html

Velkommen til Linuxhint!

I koden ovenfor opprettes et avsnitt med ID = ”para” og class = ”CL”.

CSS

“.CL ”-velgeren og“#para”CSS -velgere prøver å sette bakgrunnsfargen på

element. Legg merke til at !viktig Regel brukes på “.Cl”Selector .

Produksjon

Selv om ID -velgeren har en høyere prioritet enn klasselytteren, er det !viktig Regel vil overstyre den bakgrunnsfargede egenskapen som brukes i ID = ”para”Selector.

Konklusjon

De !Viktig regel er ganske nyttig i forskjellige komplekse scenarier der flere eksterne og interne stilark brukes og du bare vil legge til en annen CSS -egenskap med høyest prioritet. Holde betydningen av !Viktig regel i tankene, dette innlegget gir en detaljert guide om arbeid og bruk av !Viktig regel i CSS. Bruken av !Viktig regel illustreres ved å utøve den på forskjellige CSS -velgere og observere at den overstyrer den relevante CSS -egenskapen som brukes av andre CSS -velgere.