Jump to content
Sign in to follow this  
Tzunyo

Tutoriale HTML - Imagini - Elemente de baza in HTML

Recommended Posts

Tutoriale HTML - Imagini - Elemente de baza in HTML
In HTML imaginile sunt definite cu tagul <img>
Tagul <img> este unul fara pereche ( se va termina prin "/>" ), ceea ce inseamna ca acesta contine doar atribute.
Pentru a afisa o imagine trebuie sa specificati atributul src. "src" provine de la sursa. Valoarea src este data de
adresa imaginii de pe server.
Exemplu:

<!DOCTYPE html>
<html>
  <body>
    <img src="http://adresaweb.com/images/imagine.jpg" alt="text_alternativ"/>
  </body>
</html>

 
Atributul Alt.
Acesta este folosit pentru a afisa informatii suplimentare despre imaginea afisata ( chiar si atunci cand aceasta
nu poate fi afisata, din cauze diferite cum ar fi conexiunea de internet )
Alte atribute folosite pot fi width si height adica latimea si inaltimea imaginii.

<!DOCTYPE html>
<html>
<body>
<img src="http://adresaweb.com/images/imagine.jpg" alt="text_alternativ" width="300" height="250" />
</body>
</html>

 
De asemenea tagul <img> suporta si atributele globale ( pe care le puteti gasi aici : http://www.w3schools.com/html5/html5_ref_globalattributes.asp )
si care va ajuta la stilarea paginii.
Copiati aceste exemple intr-un editor text si dati save as -> imagini.html iar in loc de http://adresaweb.com/images/imagine.jpg
puneti adresa imaginii ( gen src="/images/imagine.jpg." )
Sfat: E o practica buna sa specificati latimea si inaltimea imaginii deoarece browserul, la incarcarea paginii, va rezerva spatiul
necesar imaginii. Fara a specifica aceste atribute browserul nu cunoaste de la inceput marimea imaginii si asta va cauza modificarea
layoutului la incarcarea paginii.
© Tzunyo

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...