Hvordan justere grensebredden ved hjelp av CSS

Hvordan justere grensebredden ved hjelp av CSS

I HTML er grenser designet for å skape forskjeller mellom to seksjoner og for å style et element. For dette formålet, "grense”Eiendom til CSS brukes. Denne egenskapen lar deg justere grensens bredde, stil og farge. Grensebredden avhenger av elementets utseende der vi bruker denne eiendommen.

I denne håndboken lærer vi hvordan du kan justere bredden på grensen.

La oss begynne!

Hva er "grense" eiendom i CSS?

I HTML, for å designe en grense rundt et element, "grense”Eiendom brukes. I utgangspunktet er det en kortvarig eiendom av "grensebredde”,“grensestil”, Og“grensefarge”. Den brukes til å sette grensens bredde, grensens stil og grensens farge.

Syntaks for grenseeiendommer er:

Border: Bredde Stilfarge


Her er beskrivelsen av de gitte verdiene:

    • bredde: Den brukes til å justere bredden på grensen.
    • stil: Det brukes til styling av grensen, for eksempel en solid, ås eller dobbel.
    • farge: Det brukes til å endre grensens farge.

grense”Eiendom vil bli implementert i følgende eksempel.

Eksempel: Lag grense ved hjelp av CSS

I dette eksemplet vil vi lage en grense rundt en HTML -seksjon og tilordne klassen “grense”Til det. Inne i delen vil vi legge til et avsnitt ved hjelp av

stikkord:


"Suksess er ikke endelig; fiasko er ikke dødelig:
Det er motet til å fortsette som teller." - Winston s. Churchill



Etter det vil vi flytte til CSS og justere grenselengden ved å bruke "grense”Eiendom.

Her vil vi bruke “.grense”For å få tilgang til klassen har vi tildelt seksjonen. Vi har satt verdien av bredden “5px", stil "fast”, Og farge”RGB (142, 26, 153)”. Til slutt er bakgrunnsfargen på seksjonen spesifisert som "Reg (214, 159, 181)”:

.grense
Grense: 5px Solid RGB (142, 26, 153);
bakgrunnsfarge: RGB (214, 159, 181);


Når det hele er gjort, utfør HTML -filen for å se følgende utdata:


Merk: Du kan også øke eller redusere bredden i henhold til din preferanse.

Eksempel 2: Juster grensebredden rundt et bilde

I dette eksemplet vil vi justere grensebredden rundt et bilde. For å gjøre det, vil vi legge til et bilde ved hjelp av taggen i HTML -filen:




Gå nå til CSS -filen og sett grensebredden, stilen, fargen som "10px”,“spor”,“RGB (255, 0, 0)”, Henholdsvis:

IMG
Grense: 10px Groove RGB (255, 0, 0);


Det vil gi oss følgende utdata:


Merk: I “grense”Eiendom, du må alltid tildele en positiv verdi til bredden.

Vi har tilbudt metoden for å justere bredden på grensen rundt ethvert element.

Konklusjon

I CSS, for å justere grensen rundt et element, "grense”Eiendom brukes. Du kan øke og redusere bredden på grensen i henhold til elementerens nødvendige utseende. I denne artikkelen har vi forklart hvordan du justerer grensebredden ved å bruke "grense”Eiendom og gi forskjellige eksempler på den.