În limbajul de marcare hipertext (HTML), se utilizează o comandă specială „tag” pentru a afișa o imagine pe o pagină. Această etichetă este denumită img și conține un set de variabile - „atribute”. Cu ajutorul atributelor, puteți determina toate aspectele afișării unei imagini într-o pagină de hipertext, inclusiv dimensiunile acesteia. Cu toate acestea, aceasta nu este singura modalitate de a rezolva problema - puteți reduce, de asemenea, dimensiunea imaginii utilizând Foi de stil în cascadă (CSS).
Instrucțiuni
Pasul 1
Plasați atributele de înălțime și lățime în eticheta responsabilă pentru afișarea imaginii dorite. Setați primul pe dimensiunea verticală a imaginii, iar al doilea pe orizontală. Setați ambele numere în pixeli, dar nu este nevoie să indicați unități - px - aici. Când calculați valorile necesare pentru aceste atribute, acordați atenție respectării proporțiilor reducerii imaginii, altfel va fi afișată într-o formă distorsionată. De exemplu, pentru a pune într-o pagină o imagine înjumătățită dintr-un fișier numit SomePic.jpg, ale cărui dimensiuni inițiale sunt de 500 x 300 pixeli, eticheta poate fi realizată cu următoarea comandă:
Pasul 2
Puteți seta reducerea proporțională a dimensiunilor originale ale imaginii în procente. Pentru a face acest lucru, utilizați numai atributul înălțime fără a specifica lățimea și adăugați un semn procent după specificarea numărului care definește mărimea. De exemplu, puteți obține același efect ca în exemplul din pasul anterior cu o etichetă scrisă în acest formular:
Pasul 3
Dacă doriți să specificați dimensiunea imaginii utilizând descrierea stilurilor, utilizați același nume de etichetă - img - și atributele - lățime și înălțime. În acest caz, trebuie specificate întotdeauna unitățile de măsură - px, pt sau%. Pentru a seta înjumătățirea dimensiunii tuturor imaginilor de pe pagină, plasați următoarea intrare în blocul de descriere a stilului: img {înălțime: 50%;} Dacă trebuie să reduceți dimensiunea unei singure imagini, adăugați un atribut id suplimentar etichetei sale și atribuiți-i un unic pentru imaginile valorii acestei pagini - de exemplu, PicOne: Adăugați aceeași valoare înregistrării de stil, separându-l cu un „hash” # de numele etichetei. Descrierea completă a stilului în acest caz poate arăta astfel: img # OnePic {înălțime: 50%;}
