Există o diferență între introducerea unei imagini pe un pagină web și transformând imaginea respectivă într-un link pe care se poate face clic. desi HTML este similar, un link se bazează pe un ancoră element în timp ce o imagine utilizează img element. Cu toate acestea, o imagine poate fi cuibărită într-o ancoră, făcând ca acea imagine să poată fi făcută clic ca link.
Inserarea imaginilor în elementele de ancorare
O utilizare obișnuită a unui link bazat pe imagini este grafica logo-ului site-ului, care este apoi legată înapoi la pagina de pornire a site-ului.
Iată cum ați plasa o imagine care nu poate fi făcută clic în documentul HTML:
Pentru a transforma imaginea într-un link, adăugați linkul de ancorare, deschizând elementul de ancorare înaintea imaginii și închizând ancora după imagine. Această tehnică este similară cu modul în care legați textul, cu excepția faptului că în loc să înfășurați cuvintele, înfășurați imaginea:
Când adăugați acest tip de HTML la pagina dvs., nu puneți spații între eticheta de ancorare și eticheta de imagine. Dacă faceți acest lucru, unele browsere vor adăuga căpușe lângă imagine, care vor arăta ciudat.
Logo-ul acționează acum și ca buton pentru pagina de pornire, care este aproape un standard web în zilele noastre.
Observați că nu includem stiluri vizuale, cum ar fi lățimea și înălțimea imaginii, în marcajul nostru HTML. Vom lăsa aceste stiluri vizuale la CSS și vom menține o separare curată a structurii HTML și a stilurilor CSS.