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.
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 foloseşte 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 , Baseline , 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>titlu documentului</title>
</head>
<body>
<img src=”imagine.jpg” alt=”puteti adauga orice text” align=”top” width=”100″ height=”120″ border=”4″ hspace=”10″ vspace=”7″></img>
</body>
</html>

– In pagina web va aparea:

puteti adauga orice text

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