Картинки и HTML атрибути

Как се добавя изображение в HTML и защо атрибутите са задължителни

За да покажете изображение в уеб страница, използвате тага за снимки и задължително му задавате път до файла чрез атрибут. Без този атрибут браузърът не знае коя картинка да визуализира. Някои HTML тагове нямат затваряща част, защото не съдържат текст – те само „вмъкват“ съдържание, както е при изображенията. Добрата организация на файловете в папки прави проекта по-ясен и лесен за поддръжка.

Стъпка по стъпка: добавяне на снимка към страницата

1. В папката на проекта (където е index.html) създайте нова папка, например Images.
2. Поставете вътре желаната снимка (например photo.jpg).
3. В HTML файла добавете таг за изображение.
4. Към тага добавете атрибут, който указва пътя до файла.
5. Запишете файла и презаредете браузъра, за да видите резултата.

Важно е пътят да бъде релативен спрямо текущия HTML файл – в случая това е името на папката и файла в нея.

Основни елементи от урока

• img – таг за вмъкване на изображение; няма затварящ таг.
• src – атрибут, който указва пътя до изображението (вътре в кавички след знак =).

Това е първата стъпка към създаване на по-богати и визуално привлекателни уеб страници. В следващите уоци ще надградим с оформление и стил.