Brukere kan bruke flere CSS -egenskaper for å gjøre websider attraktive som “høyde”,“bredde”,“Tekstalign”,“grensestil”,“Border-Radius”, Og“polstring”. Mer spesifikt, “grense”Eiendom legger grensen rundt elementet. Videre kan det hende at brukeren vil legge til en gjennomsiktig grense rundt elementet for å gjøre ting bak objektene mer synlige. “grense”Attributt med“RGBA”Verdien brukes deretter til å sette grensenes opacitet.

Dette innlegget vil forklare metoden for å gjøre en gjennomsiktig grense ved hjelp av CSS -egenskaper.

Hvordan lage en gjennomsiktig grense med CSS?

For å lage en gjennomsiktig grense til CSS, kan du prøve ut den gitte prosedyren.

Trinn 1: Lag en div container

Først må du lage en "”Container i HTML -kroppen. Legg til en klasseattributt i elementet.

Trinn 2: Legg til overskrift

Deretter legger du til en overskrift ved hjelp av "

”Merk og bruk“tilpasse”Attributt for å spesifisere overskriften i sentrum av div. Legg deretter til teksten mellom de ekstra overskriftene -kodene:

Linuxhint Tutorial Website Ltd UK

Produksjon

Trinn 3: Angi bakgrunnsfarge

kropp
bakgrunnsfarge: RGB (8, 8, 14);

Her får du tilgang til kroppen med tagnavn og spesifiser bakgrunnsfargen ved å bruke "bakgrunnsfarge”Eiendom.

Trinn 4: Stil på vei med CSS

H1
Farge: RGB (23, 83, 5);

Nå, bruk “farge”Eiendom for å style overskriftsteksten ved hjelp av tagnavnet”H1”.

Trinn 5: Lag solid kant

Deretter får du tilgang til “.ytre innhold”Klasse og spesifiser de nevnte CSS -egenskapene:

.ytre innhold
Grense: 10px solid RGB (25, 140, 194);
Bredde: 200px;
Høyde: 200px;
Margin: Auto;
tekst-align: sentrum;
Border-Radius: 7px;
polstring: 4px;

Her:

• “grense”Eiendom brukes til å gjøre en grense rundt et element.
• “bredde”Angir elementets bredde.
• “høyde”Eiendom tildeler høyden for beholderen.
• “margin”Definerer romets ytre side av den definerte grensen.
• “Tekstalign”Eiendom brukes til å angi teksten i sentrum.
• “Border-Radius”Eiendom runder grensehjørnet i henhold til verdien.
• “polstring”Angir plassen rundt elementinnholdet.

Det kan legges merke til at det er satt en solid grense rundt elementet:

Trinn 6: Gjør grensen gjennomsiktig

Grense: 10px Solid RGBA (114, 200, 240, 0.3);

For å gjøre grensen gjennomsiktig, bruk "grense”Eiendom, og tilordne verdien med“RGBA" fargevelger. Her spesifiserer de tre første verdiene RGB -fargen, og den fjerde verdien setter grensenes opacitet. For eksempel tildeles opaciteten som "0.3”For å gjøre grensen gjennomsiktig:

Produksjon

Denne bloggen har demonstrert instruksjonene for å gjøre en gjennomsiktig grense til CSS.

Konklusjon

For å gjøre en gjennomsiktig grense med CSS, får du først få tilgang til DIV ved hjelp av den spesifiserte "klasse”. Bruk deretter “grense”Eiendom og setter grensen og opaciteten på grensen ved å bruke“RGBA" fargevelger. Hvor "RGB”Er for de røde, grønne og blå fargene, og“en”Brukes til å sette verdien av opacitet for å gjøre grensen gjennomsiktig. Dette innlegget forklarte prosedyren for å gjøre grensen gjennomsiktig med CSS.