I hypertext markup language (HTML) brukes en spesiell kommando "tag" for å vise et bilde på en side. Denne koden blir referert til som img og inneholder et sett med variabler - "attributter". Ved hjelp av attributter kan du bestemme alle aspekter ved visning av et bilde på en hypertekstside, inkludert dimensjoner. Dette er imidlertid ikke den eneste måten å løse problemet på - du kan også redusere størrelsen på bildet ved hjelp av Cascading Style Sheets (CSS).
Bruksanvisning
Trinn 1
Plasser høyde- og breddeattributtene i koden som er ansvarlig for å vise ønsket bilde. Sett den første til den vertikale størrelsen på bildet, og den andre horisontalt. Sett begge tallene i piksler, men det er ikke nødvendig å indikere enheter - px - her. Når du beregner de nødvendige verdiene for disse attributtene, må du være oppmerksom på at proporsjonene til reduksjonen av bildet overholdes, ellers vises det i en forvrengt form. For eksempel, for å sette et halvert bilde på en side fra en fil som heter SomePic.jpg, hvis innledende dimensjoner er 500 x 300 piksler, kan taggen gjøres med følgende kommando:
Steg 2
Du kan angi proporsjonal reduksjon av de originale bildedimensjonene i prosent. For å gjøre dette, bruk bare høydeattributtet uten å angi bredde, og legg til et prosenttegn etter å ha angitt størrelsen som definerer tallet. For eksempel kan du oppnå samme effekt som i eksemplet fra forrige trinn med en tag skrevet i dette skjemaet:
Trinn 3
Hvis du vil spesifisere størrelsen på bildet ved hjelp av beskrivelsen av stilene, bruker du det samme kodenavnet - img - og attributtene - bredde og høyde. I dette tilfellet må måleenhetene - px, pt eller% - alltid spesifiseres. For å angi halveringen av størrelsen på absolutt alle bilder på siden, plasserer du følgende oppføring i stilbeskrivelsesblokken: bilde {høyde: 50%;} Hvis du trenger å redusere størrelsen på bare ett bilde, kan du legge til et ekstra id-attributt til koden, og tildel den en unik for bildene av denne sideverdien - for eksempel PicOne: Legg til den samme verdien i stiloppføringen, og skille den med et "hash" # fra kodenavnet. Den komplette stilbeskrivelsen i dette tilfellet kan se slik ut: img # OnePic {høyde: 50%;}
