Тэг img

Тэг img стварае выяву. Шлях да выявы прапісваецца ў атрыбуце src. Не патрабуе зачыняльнага тэга.

Атрыбуты

Атрыбут	Апісанне
src	Задае шлях да выявы. Абавязковы атрыбут.
alt	Альтэрнатыўны тэкст, які будзе паказаны замест выявы, калі яна не знойдзена (напрыклад, няправільна прапісаны шлях да яе). Абавязковы атрыбут. Пры яго адсутнасці будзе скардзіцца валідатар (праграма, якая правярае карэктнасць HTML ці CSS).
width	Шырыня выявы, у пікселях (у гэтым выпадку адзінкі вымярэння не паказваюцца) ці працэнтах ад бацькі выявы.
height	Вышыня выявы, у пікселях (у гэтым выпадку адзінкі вымярэння не паказваюцца) ці працэнтах ад бацькі выявы.

Нюансы

Калі для выявы не задана ні шырыня, ні вышыня - выява будзе мець свой рэальны памер. Калі задана вышыня - выява стане зададзенай вышыні, а па шырыні падстройваецца так, каб яе прапорцыі не былі скажоныя.

Калі задана толькі шырыня - аналагічна, выява падстройваецца па вышыні так, каб захаваць прапорцыі.

Калі задана і шырыня, і вышыня - прапорцыі выявы могуць быць скажоныя (а можа і не, як адгадаеце). Калі шырыня ці вышыня (ці абодва разам) больш рэальнай - выява павялічыцца, але страціць у якасці.

Рэкамендуецца задаваць шырыню і вышыню выявам у атрыбутах (а не праз CSS) - у гэтым выпадку браўзэр хутчэй будзе загружаць выявы - яму няма неабходнасці вылічваць памер кожнай выявы пасля яе атрымання.

Не рэкамендуецца памяншаць рэальныя памеры выявы без неабходнасці. Напрыклад, рэальны памер выявы 1000 на 1000 пікселяў, а вы ёй задасце шырыню ў 100px. У гэтым выпадку выява на экране будзе выглядаць на 100 пікселяў, аднак мець памер на ўсю тысячу і, адпаведна, загружацца нашмат даўжэй.

Прыклад

Дададзім на сайт выяву і не будзем задаваць атрыбуты height і width. Выява будзе мець свой рэальны памер:

:

Прыклад

Давайце паспрабуем выяве дадаць шырыню з дапамогай атрыбута width, вышыня пры гэтым павінна падстройвацца так, каб захаваць прапорцыі выявы:

:

Прыклад

А цяпер давайце выяве дадзім вышыню з дапамогай атрыбута height, шырыня пры гэтым падстройваецца так, каб захаваць прапорцыі выявы:

:

Прыклад

Давайце адначасова выяве дадзім і вышыню, і шырыню. Прапорцыі выявы пры гэтым павінны стаць скажонымі (не абавязкова, але ў дадзеным выпадку вышыня і шырыня падабраны так, каб прапорцыі сказіліся):

:

Прыклад

Давайце паставім няправільны шлях да выявы (для прастаты пакінем яго пустым). Замест выявы мы ўбачым змесціва атрыбута alt (здаецца, што гэта звычайны тэкст - але паспрабуйце яго скапіяваць - у вас нічога не атрымаецца, ён будзе цягнуцца як выява):

:

Глядзіце таксама