logo

ХТМЛ слика

ХТМЛ ознака имг се користи за приказивање слике на веб страници. ХТМЛ имг ознака је празна ознака која садржи само атрибуте, завршне ознаке се не користе у ХТМЛ елементу слике.

Погледајмо пример ХТМЛ слике.

 <h2>HTML Image Example</h2> <img src="//techcodeview.com/img/html-tutorial/39/html-image.webp" alt="Good Morning Friends"> 
Тестирајте одмах

Излаз:

Добро јутро пријатељи

Атрибути ХТМЛ ознаке имг

Срц и алт су важни атрибути ХТМЛ ознаке имг. Сви атрибути ХТМЛ ознаке слике су дати испод.

1) срц

То је неопходан атрибут који описује извор или путању слике. Он даје упутства претраживачу где да тражи слику на серверу.

Локација слике може бити у истом директоријуму или на другом серверу.

2) све

Атрибут алт дефинише алтернативни текст за слику, ако се не може приказати. Вредност атрибута алт описује слику речима. Атрибут алт се сматра добрим за СЕО перспективу.

3) ширина

То је опциони атрибут који се користи за одређивање ширине за приказ слике. Сада се не препоручује. Требало би да примените ЦСС уместо атрибута ширине.

4) висина

То је х3 висина слике. ХТМЛ атрибут висине такође подржава елементе ифраме-а, слике и објекта. Сада се не препоручује. Требало би да примените ЦСС уместо атрибута висине.


Коришћење атрибута висине и ширине са ознаком имг

Научили сте како да убаците слику у своју веб страницу, сада ако желимо да дамо неку висину и ширину за приказ слике у складу са нашим захтевима, онда можемо да је подесимо са атрибутима висине и ширине слике.

Пример:

 <img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp" alt="animal image"> 
Тестирајте одмах

Излаз:

ХТМЛ слика

Напомена: Увек покушајте да уметнете слику са висином и ширином, иначе може да трепери док се приказује на веб страници.


Употреба атрибута алт

Можемо да користимо атрибут алт са таг. Приказаће алтернативни текст у случају да се слика не може приказати у претраживачу. Следи пример за алт атрибут:

 <img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp" alt="animal image"> 

Излаз:

ХТМЛ слика

Како добити слику из другог директорија/фолдера?

Да бисте уметнули слику у свој веб, та слика мора бити присутна у истој фасцикли у коју сте ставили ХТМЛ датотеку. Али ако је у неком случају слика доступна у неком другом директоријуму, онда можете приступити слици овако:

 

У горњој изјави ставили смо слику на локални диск Е------>имагес фолдер------>имг/хтмл-туториал/39/хтмл-имаге-2.вебп.

Напомена: Ако срц УРЛ буде нетачан или погрешно написан онда неће приказати вашу слику на веб страници, па покушајте да унесете исправан УРЛ.


Користите означити као везу

Такође можемо повезати слику са другом страницом или можемо користити слику као везу. Да бисте то урадили, ставите ознака унутар таг.

Пример:

 <img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp"> 
Тестирајте одмах

Излаз:


Подржава претраживаче

Елемент цхроме претраживачХром односно претраживачИЕ фирефок претраживачФирефок Опера претраживачОпера сафари претраживачСафари
дадададада