Adaugare imagini

HTML contine si elemente pentru adaugarea de imagini in pagina web.

1. Formatul imaginilor care pot fi folosite

Cele mai folosite formate pentru imaginile adaugate intr-o pagina HTML sun GIF si JPEG (JPG ; JPE), avantajul acestora este ca imaginile care au aceste extensii au o marime mica (in bytes), avand maximum 256 de culori. Click pentru mai multe formate

Alte tipuri de formate (folosite mai rar) sunt:

  • PNG, BMP, TIFF, PCX

2. Adaugarea unei imagini intr-o pagina web

Pentru a introduce o imagine intr-un format HTML se foloseste elementul <img> ... </img> împreuna cu urmatoarele atribute :


  • - src - Valoarea acestui atribut determina locatia fisierului care contine imaginea.
  • - alt - La acest atribut se scrie textul care va aparea daca imaginea nu e afisata (de unele browsere) sau cand utilizatorul va pozitiona, in browser, mouse-ul peste imagine.
  • - align - Acest atribut permite asezarea imagini in locuri diferite pe pagina. Pot fi folosite urmatoarele optiuni: Bottom, Middle, Top, Left, Right, TextTop, ABSMiddle, Basespanne si ABSBottom
  • - width - Valoarea acestui atribut reprezinta lungimea imaginii, in pixeli. Daca nu este scris imaginea va fi prezentata cu lungimea originala.
  • - height - Valoarea acestui atribut reprezinta inaltimea (latimea) imaginii, in pixeli. Daca nu este scris imaginea va fi prezentata cu inaltimea originala.
  • - border - Prin adaugarea acestui atribut imaginea va aparea înconjurata de un chenar, valoarea acestui atribut reprezinta grosimea chenarului, in pixeli.
  • - hspace - Acest atribut este pentru spatiu orizontal pe ambele parti ale imaginii, specificat in pixeli. De exemplu o valoare de 5 va pune un spatiu invizibil, de 5 pixel, in pârtile orizontale ale imaginii.
  • - vspace - Acest atribut este pentru spatiu vertical pe ambele parti ale imaginii, specificat in pixeli. De exemplu o valoare de 5 va pune un spatiu invizibil, de 5 pixel, in pârtile verticale ale imaginii.

In exemplu de mai jos puteti vedea modul de introducere a unei imagini pe o pagina web si cum pot fi folosite atributele:

<html>
<head>
 <title>Titlul documentului</title>
</head>
<body>
  <img src="imagine.png" alt="puteti adauga orice text" align="top" width="83" height="53" border="4" hspace="20" vspace="7"></img>
</body>
</html>
Browser:
puteti adauga orice text

Incercati singuri mai multe exemple, folosind si alte atribute si valori prezentate mai sus.