Å bygge et dyktig nettsted er ikke en lett oppgave, en utvikler må prøve flere ting for å lage et attraktivt nettsted som ulik bakgrunn, stiler, grenser osv.

CSS -grensen kan brukes rundt innholdet for å forbedre innholdets utseende. Grenseegenskapene lar oss bestemme grenseområdet til et element (er). En grense kan spesifiseres med flere stiler som en solid linje, streker osv.

Denne oppskrivningen vil gi en omfattende oversikt over eiendommen. Opprinnelig utdyper det hvordan forhåndsdefinerte verdier fungerer med eiendommen. Og etterpå demonstrerer det å arbeide med egenskapen til grensebredde ved bruk av noen spesifiserte verdier.

Grensebredde eiendom

Grensebredde eiendom bestemmer bredden på et elementets grense. Den spesifiserer grensens bredde i alle fire retninger i.e. topp, bunn, høyre og venstre. Hver verdi som er tilordnet egenskapen til grensebredden vil bli spesifisert til alle sider.

Syntaks
Syntaksen til egenskapen til grensebredde er beskrevet i det undergitte utdraget:

Grensebredde: Størrelse;

Breddestørrelsen kan spesifiseres ved hjelp av noen forhåndsdefinerte verdier som tykke, tynne, middels eller i form av piksler, punkter, centimeter osv.

La oss vurdere noen eksempler for å ha en dyp forståelse av egenskapen til grensebredde i CSS.

Hvordan tilordne grensebredde ved å bruke forhåndsdefinerte verdier

I CSS kan vi spesifisere størrelsen på grensen ved å bruke de forhåndsdefinerte verdiene som tykk, tynn, medium.

Eksempel
Det undergitte kodestykket setter grensestørrelsen på

, og

element ved bruk av forhåndsdefinerte verdier:

CSS

H1
Border-stil: Solid;
Grensebredde: tykk;

P
Border-stil: Solid;
Grensebredde: Medium;

Html

Grensebredde ved bruk av forhåndsdefinerte verdier

Første avsnitt

Andre avsnitt

Det vil produsere følgende utgang:

Hvordan legge til grensebredde ved hjelp av spesifikke verdier

I CSS kan vi tildele en spesifikk størrelse for å sette grensens bredde (i.e. PX, CM, etc.).

Eksempel
Følgende kode setter grensebredden på

element i px og grensebredde på

i CM:

CSS

H1
Border-stil: Solid;
Borderbredde: 0.1cm;

P
Border-stil: Solid;
grensebredde: 1px;

Html

Grensebredde ved bruk av forhåndsdefinerte verdier

Første avsnitt

Andre avsnitt

Vi får følgende utdata for ovennevnte kode:

Hvordan tilordne spesifikke sidebredder

I CSS kan spesifikke sidebredder tilordnes til grensebreddeegenskapen. Som standard setter egenskapen til grensebredde den like grensens bredde til alle fire sider. Vi kan imidlertid spesifisere hver sides bredde i topp, høyre, bunn og venstre bestilling.

Eksempel
Dette eksemplet tilordner fire verdier til den første egenskapen til bakgrunnsbredde først for øverste kant, andre for høyre kant, tredje for bunn og den siste for venstre kant:

CSS

H1
Border-stil: Solid;
Borderbredde: 0.3cm 0.2cm 0.1 0.2;

P
Border-stil: Solid;
Borderbredde: 3px 2px 1px 1px;

Hmtl

Grensebredde ved bruk av forhåndsdefinerte verdier

Første avsnitt

Andre avsnitt

Ovennevnte kode vil produsere følgende utgang:

Eksempel 2
Dette eksemplet tildeler to verdier til bakgrunnsbelastningsegenskapen:

• Første verdi spesifiserer størrelsen for topp og bunn
• Andre verdi spesifiserer størrelsen for venstre og høyre side

CSS

H1
Border-stil: Solid;
Borderbredde: 0.2cm 0.1cm;

P
Border-stil: Solid;
Grensebredde: 2px 1px;

Html

Grensebredde ved bruk av forhåndsdefinerte verdier

Første avsnitt

Andre avsnitt

Ovennevnte kode viser følgende utgang:

En klar forskjell i (øverste, nederst) og (venstre, høyre) sider kan bemerkes i utgangen.

Konklusjon

Grensebreddeegenskapen setter alle fire grenser for et element. Hvis egenskapen over bredden har en verdi, vil den sette den samme grensen til alle fire sider. I tilfelle av to verdier, refererer den første verdien til "topp og bunn", og andre refererer til "venstre og høyre" grensene. Hvis det er tre verdier, refererer først til toppgrensen, refererer andre til venstre og høyre kant, mens den tredje refererer til bunngrensen. Hvis det er fire verdier, vil ordren rotere i klokken.e. øverst, høyre, nederst, venstre.

Denne artikkelen presenterte en retningslinje for å angi grensebredden ved hjelp av forhåndsdefinerte verdier, og spesifiserte verdier. Etterpå forklarte denne oppskrivningen hvordan du kan sette en unik grensestørrelse for hver side.