Imaginile sunt foarte importante pentru a înfrumuseța, precum și pentru a descrie multe concepte complexe într-un mod simplu pe pagina dvs. web. Acest tutorial va face prin pași simpli pentru a utiliza imagini în paginile dvs. web.
Cum sa inserați imagii in paginile web?
Puteți introduce orice imagine în pagina dvs. web folosind <img> tag.
Urmează sintaxa simplă pentru a utiliza această etichetă.
<img src = "Image URL" ... attributes-list/>
Exemplu:
<!DOCTYPE html>
<html>
<head>
<title>Cum sa inserați imagini HTML in paginile web?</title>
</head>
<body>
<h1>Adaugam un text oarecare, cat avem nevoie.</h1>
Ca exemplu:<br />
<img src = "https://www.agernic.com/ro/html/imagine_romania.jpg" alt = "Romania frumoasa" />
<!-- sfarsit inserare imagine HTML <img> --> </p>
</body>
</html>
Nota: Atributul - alt - oferă un text alternativ pentru imagine, dacă utilizatorul din anumite motive nu poate vizualiza imagina (din cauza conexiunii lente, a unei erori în atributul src sau dacă utilizatorul utilizează un cititor de ecran).
Set Image Width/Height
Setați lățimea / înălțimea imaginii
Puteți seta lățimea și înălțimea imaginii în funcție de cerința dvs. utilizând atribute de lățime și înălțime.
Puteți specifica lățimea și înălțimea imaginii în termeni de pixeli sau procent din dimensiunea reală.
Exemplu 2: width = "120" height = "90"
<!DOCTYPE html>
<html>
<head>
<title>Cum sa inserați imagini HTML, Set Image Width/Height?</title>
</head>
<body>
<h1>Set Image Width/Height, lungime/inaltime</h1>
Ca exemplu:<br />
<img src = "https://www.agernic.com/ro/html/imagine_romania.jpg"
alt = "Romania frumoasa"
width = "120" height = "90" />
<!-- sfarsit inserare imagine latime si inaltime <img> --> </p>
</body>
</html>
Set Image Border
Setați marginea sau chenarul imaginii
În mod implicit, imaginea va avea un chenar în jurul acesteia, puteți specifica grosimea marginilor în termeni de pixeli folosind atributul border. O grosime de 0 înseamnă, fără margine în jurul imaginii.
Exemplu 3:
<!DOCTYPE html>
<html>
<head>
<title>Cum sa setați marginea imaginii?</title>
</head>
<body>
<h1>Setare chenar imaginii.</h1>
Ca exemplu:<br />
<img src = "https://www.agernic.com/ro/html/imagine_romania.jpg"
alt = "Romania frumoasa" border = "3" />
<!-- sfarsit inserare chenar imagine -border- --> </p>
</body>
</html>
Set Image Alignment
Setați alinierea imaginii
În mod implicit, imaginea se va alinia în partea stângă a paginii, dar puteți utiliza atributul align pentru a-l seta în centru sau în dreapta.
Exemplu 4:
<!DOCTYPE html>
<html>
<head>
<title>Cum sa inserați aliniament imagini HTML?</title>
</head>
<body>
<h1>Aliniament imagine.</h1>
Ca exemplu:<br />
<img src = "https://www.agernic.com/ro/html/imagine_romania.jpg"
alt = "Romania frumoasa" border = "3" align = "right"/>
<!-- sfarsit inserare imagine aliniament --> </p>
</body>
</html>
This tool makes it easy to create, adjust, and experiment with custom colors for the web.
Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.
Find here examples of creative and unique website layouts.
Find here examples of creative and unique website CSS HTML menu.