Image manager - img tag

Indholdsfortegnelse:

Image manager - img tag
Image manager - img tag
Anonim

Billedet er ikke bare indsat direkte i teksten. Browseren får at vide dens navn og instrueret hvor og hvordan den skal placeres på skærmen. For at gøre dette skal du bruge et enkelt HTML-img-tag. Det angiver placeringen af det grafiske objekt på websiden.

Hvis mange attributter er valgfrie for tags, skal img-tagget have mindst én parameter - adressen på billedet. Denne attribut kaldes src:

  • - dette vil vise goat.jpg-filen, der er gemt i den aktuelle mappe;
  • - med denne parameter i img-tagget vil browseren indlæse billedet, der er lagt ud på internettet på webstedet megasellmag.ru.

Alignment attributes

For at placere billeder på en side ved hjælp af HTML, bruges img-tagget, hvis attributter er ansvarlige for at placere billedet på siden og arten af dets tekstombrydning.

img tag
img tag

Som standard placerer browseren billedet i midten af skærmen, og teksten ombrydes ikke omkring det. Img-tagget giver dig mulighed for at udtrykke din uenighed med browseren ved at bruge align-attributten (alignment).

- billedet vil blive placeret i venstre kant af siden, og teksten vil gå rundt om det til højre.

Tekstens adfærd vil være ens, hvis billedet er placeret til højre (align=right), i midten (align=middle), top (align=top), bund(align=bund) og centreret (center).

Indstillinger og størrelser

For at forhindre tekst i at krybe ind i billeder, har img-tagget fået specielle attributter -hspace (horisontale/horisontale marginer) og vspace (lodrette/lodrette marginer), som bestemmer mængden af tekstindrykning fra kanterne af billeder i pixels.

img tag attributter
img tag attributter

Billedet vil ikke kun lydigt bevæge sig væk fra teksten med den angivne mængde, men også bevæge sig væk fra kanten af siden, så det er bedst at undgå store indrykker.

De geometriske dimensioner af billeder er meget vigtige, hvilket ikke kun er ønskeligt, men nogle gange blot nødvendigt at specificere for den korrekte visning af billedet. Til dette bruges attributterne width (width) og height (height), hvis værdi er angivet i pixels eller procenter.

Hvis du kun angiver bredden, vælges højden automatisk med de originale proportioner. Procentstørrelser giver dig mulighed for at placere billedet i højre del af siden, uanset størrelsen på browservinduet, og dette behov opstår ofte.

Andre muligheder

Border-attributten omslutter billedet i en ramme med den angivne tykkelse, hvilket browseren ikke gør som standard.

Grænsen kan også have en tilsyneladende meningsløs nul-bredde (kant='0'), men det er indtil billedet bliver et link, hvor browseren automatisk cirkler om det med en blå kant uden at vente på instruktioner.

Nogle utålmodige brugere, rasende over lave internethastigheder, vil simpelthen deaktivere visningen af billeder. I sådanne tilfælde leveres alt-parameteren, som giver dig mulighed for at indtaste alternativ tekst, som brugeren vil se i boksen, hvor billedet har travlt med at indlæse.

Hvis du ikke kan lide mulighederne for alt-parameteren, kan img-tagget tilbyde en longdesc-attribut, hvis værdi er URL'en på et dokument med en mere detaljeret beskrivelse.

Usemap- og ismap-attributterne fortæller browseren, at billedet vil være et billede, hvor hyperlinks er separate områder (link map), kun usemap-parameteren bestemmer navigationskortet på serveren, og ismap - kortet på kundesiden.

Beskrivelse af link 1 i nedenstående figur:

html img tag
html img tag

Eksotiske varer

Lowsrc-attributten instruerer browseren om først at downloade en kopi (eller et andet alternativ) af det originale billede med en lavere kvalitet og derfor en "lettere". Dette trick leveres i tilfælde af lav internethastighed for brugeren. Når det originale billede er uploadet, erstatter det "falske".

Den mindre almindeligt anvendte galleryimg-attribut for img-tagget fremkalder billedkontrolpanelet (når den holdes over), så du kan åbne standardmappen Mine billeder og udskrive, gemme eller e-maile billedet. Du kan deaktivere panelet ved at indstille parameteren galleryimg til no/false, og aktivere det ved at indstille yes/true.

I den nye HTML5-specifikation har en række tags nogle parametre forældet. For eksempel er attributterne lowsrc, border, longdesc og name for img blevet trukket tilbage.

Anbefalede: