Bilder er den mest avgjørende delen av websider som brukes til å gjøre nettsteder mer attraktive og informative. Videre kan nettutviklere sette inn forskjellige typer bilder, for eksempel bakgrunnsbilder, illustratører og produktbilder. I tillegg kan brukere bruke forskjellige stiler på bilder, som å definere grenser rundt et bilde.

Denne oppskrivningen vil oppgi:

• Hvordan legge til et bilde i HTML?
• Hvordan du legger/setter inn en kant til et bilde i HTML?
• Hvordan du legger/setter inn en kant til et bilde i CSS?

Hvordan legge til et bilde i HTML?

For å legge til et bilde i et HTML -dokument, følg de listede instruksjonene:

• Først, bruk enhver overskriftskode “

  " til "

  ”For å legge inn overskriften. For eksempel har vi innebygd overskriften på nivå to ved hjelp av "

  " stikkord.

• Deretter setter du inn et "" element sammen med "klasse", "SRC" og "ALT" attributter.
• “”Tag brukes til å legge til et bilde i et HTML -dokument.
• “klasse”Attributt brukes til å peke klassen i CSS.
• “src”Brukes til å spesifisere URL eller kilde til bildet.
• “alt”Angir et navn eller en alternativ tekst for bildet:

Legg til grensen til et bilde

Det kan observeres at bildet er lagt til en HTML -side:

Hvordan du legger/setter inn en kant til et bilde i HTML?

For å legge en kant til et bilde i HTML, bruk inline CSS direkte i bildekilden ved hjelp av oppgitte instruksjoner:

• I “”Tag, spesifiser“stil" Egenskap. Verdien av "stil" definerer egenskapene til CSS for styling av det definerte elementet.
• For å bruke en grense rundt bildet, bruk stilverdien “Grense: 5px solid grønn;", hvor "grense”Er CSS -egenskapen som brukes til å legge til grensen rundt elementet, i henhold til den spesifiserte stilen:

Legg til grensen til et bilde

Produksjon

Hvordan du legger/setter inn en kant til et bilde i CSS?

Brukere kan også legge til en kant til et bilde i HTML ved hjelp av innebygd CSS. For å legge til en kant utenfor bildet ved å bruke CSS, gå gjennom de medfølgende trinnene.

Trinn 1: Stiloverskrift i CSS
Først stil på overskriften ved å bruke tagnavnet "H2”Og bruk de under-nevnte CSS-egenskapene:

H2
tekst-align: sentrum;
Farge: blå;
Font: fet;

Her:

• “Tekstalign”Eiendom brukes til å stille inn justering av teksten.
• “farge”Angir den aktuelle fargen for teksten.
• “Font”Brukes til å tildele stilen til skriften.

Trinn 2: Legg til kant til et bilde
For å legge til en grense rundt bildet, får du først få tilgang til bildet i CSS ved hjelp av ".IMG-Container”Klasse. Bruk deretter følgende egenskaper på det:

.IMG-Container
Høyde: 400px;
Bakgrunnsstørrelse: Inneholder;
Bredde: 350px;
Grense: 7px Solid RGB (63, 11, 253);
Margin: 20px 150px;

Beskrivelsen av de ovennevnte egenskapene er som følger:

• “grense”Eiendom brukes til å spesifisere grensen rundt elementet.
• “høyde”Brukes til å sette høyden på det definerte elementet.
• “bakgrunnsstørrelse”CSS -eiendom brukes til å angi elementets størrelse.
• “bredde”Definerer breddestørrelsen på et element.
• “margin”Angir det tomme rommet rundt elementgrensen:

Det kan legges merke til at en blå kant er lagt til rundt et bilde.

Konklusjon

For å legge en grense til et bilde i HTML, først og fremst, legg til et bilde ved hjelp av "" stikkord. Deretter kan brukeren bruke "stil”Attributt inne i“ ”-merket og angi verdien som per krav. Videre kan brukere også bruke den innebygde CSS for å bruke "grense”Eiendom til et bilde. Dette innlegget har forklart prosedyren for å legge grensen til et bilde i HTML.