Html nedlastingsattributt

Html nedlastingsattributt
Når vi utvikler en hvilken som helst applikasjon, må vi ofte gjøre bilder nedlastbare. For eksempel et porteføljeside som gir brukere eksempler på CV til nedlasting eller mer. For å gjøre det, tilbyr HTML “nedlasting”Attributt som skal brukes i ankerkoden.

Denne artikkelen vil demonstrere HTML -nedlastingsattributtet.

Hvordan laste ned et bilde i HTML?

nedlasting”Attributt brukes i“”Eller ankerkode. Denne attributtet vil gjøre lenken til en nedlastbar lenke, som vil laste ned bildet som er spesifisert i "href" Egenskap.

Eksempel

I HTML, legg til et nytt DIV -element med klassenavnet “innhold”Inne i kroppsdelen. Deretter spesifisere en "

”Tag for å legge til litt tekst. Etter det, lag en annen div med klassenavnet “Nedlastingsbilde”. Innenfor denne diven, legg til tag tilknyttet attributtene HREF som spesifiserer lenken til bildet og nedlastingsattributtet. Definer deretter taggen med følgende attributter:

  • src”For å gi en lenke til bildet.
  • alt”Angir teksten som vises hvis bildet ikke kan laste.
  • bredde”Eiendom brukes til å sette bildens bredde.
  • høyde”Eiendom brukes til å sette høyden på bildet:

Klikk på bildet for å laste ned det:







La oss flytte til CSS -delen!

Stil “innhold” div

.innhold
Bakgrunnsfarge: #B9E0FF;
polstring: 10px;

Innholdet Div brukes med følgende CSS -egenskaper:

  • bakgrunnsfarge”Eiendom brukes til å bruke bakgrunnsfargen på elementet.
  • polstring”Eiendom gir plass inne i elementet.

Stil “Download-Image” Div

.Last ned-bilde
Bredde: 300px;
Høyde: 200px;
Margin: Auto;

.Nedlastingsbilde”Brukes for å få tilgang til“Nedlastingsbilde”Div. Undergitte egenskaper brukes på det:

  • bredde”Eiendom setter en HTML -elementbredde.
  • høyde”Eiendom setter et HTML -elementets høyde.
  • margin”Eiendom brukes til å legge til plass rundt elementet.

Stil “P” -element

.Innhold P
Font-størrelse: 20px;

skriftstørrelse”Eiendom brukt på

Tag brukes til å stille inn størrelsen på skriften.

Det kan observeres at når vi har klikket på bildet, begynner det å laste ned på systemet vårt:

Bonustips: Last ned bilde med et selvforklarende navn

Vi kan tilordne en verdi til nedlastingsattributtet. Deretter vil filen laste ned med dette spesifiserte navnet. Det er nyttig i scenarier hvis bildet har et navn som ikke er meningsfullt tilordnet i Href -attributtet.

La oss anta at bildet har navnet "ABC2334.png”Som ikke er meningsfylt. Så nedlastingsattributtet tildeles verdien “pingvin”:




Det kan sees fra bildet nedenfor at bildet blir lastet ned med et navn som er spesifisert i nedlastingsattributtet:

Det handlet om metoden for å lage en nedlastbar lenke i HTML.

Konklusjon

I HTML blir nedlastingsattributtet lagt til HTML -ankerelementet. Dette vil gjøre lenken til en nedlastbar lenke. Bildet kan lastes ned med ønsket navn. For å gjøre det er nedlastingsattributtet satt med verdien som filens navn. Denne artikkelen har demonstrert HTML -nedlastingsattributtet med et praktisk eksempel.