Kako Smanjiti Sliku U Html Formatu

Sadržaj:

Kako Smanjiti Sliku U Html Formatu
Kako Smanjiti Sliku U Html Formatu

Video: Kako Smanjiti Sliku U Html Formatu

Video: Kako Smanjiti Sliku U Html Formatu
Video: Dodavanje slike u HTML 2024, Novembar
Anonim

U jeziku za označavanje hiperteksta (HTML), posebna naredba "tag" koristi se za prikaz slike na stranici. Ova se oznaka naziva img i sadrži skup varijabli - "atributi". Uz pomoć atributa možete odrediti sve aspekte prikaza slike na hipertekstualnoj stranici, uključujući njene dimenzije. Međutim, ovo nije jedini način za rješavanje problema - veličinu slike možete smanjiti i pomoću Cascading Style Sheets (CSS).

Kako smanjiti sliku u html formatu
Kako smanjiti sliku u html formatu

Instrukcije

Korak 1

Postavite atribute visine i širine u oznaku odgovornu za prikaz željene slike. Postavite prvu na vertikalnu veličinu slike, a drugu vodoravno. Postavite oba broja u pikselima, ali ovdje nije potrebno navesti jedinice - px. Prilikom izračunavanja potrebnih vrijednosti za ove atribute, obratite pažnju na poštivanje proporcija smanjenja slike, jer će u protivnom biti prikazana u iskrivljenom obliku. Na primjer, da biste na stranicu stavili prepolovljenu sliku iz datoteke koja se zove SomePic.jpg, čije su početne dimenzije 500 sa 300 piksela, oznaka se može izvršiti sljedećom naredbom:

Korak 2

Možete postaviti proporcionalno smanjenje originalnih dimenzija slike u procentima. Da biste to učinili, koristite samo atribut visine bez navođenja širine i dodajte znak posto nakon navođenja broja koji definira veličinu. Na primjer, možete postići isti efekt kao u primjeru iz prethodnog koraka s oznakom napisanom u ovom obliku:

Korak 3

Ako želite odrediti veličinu slike koristeći opis stilova, koristite isto ime oznake - img - i atribute - širinu i visinu. U ovom slučaju, mjere za mjerenje - px, pt ili% - moraju uvijek biti navedene. Da biste postavili prepolovljenje veličine apsolutno svih slika na stranici, stavite sljedeći unos u blok opisa stila: img {visina: 50%;} Ako trebate smanjiti veličinu samo jedne slike, dodajte dodatni atribut id svojoj oznaci i dodijelite joj jedan jedinstveni za slike vrijednosti ove stranice - na primjer, PicOne: Dodajte istu vrijednost u zapis stila odvajajući je "hash" # od imena oznake. Kompletni opis stila u ovom slučaju može izgledati ovako: img # OnePic {visina: 50%;}

Preporučuje se: