Вставка изображения на html сайте. Тег img и его атрибуты

Вставка изображения осуществляется с помощью тега <img>. В значении атрибута src (от source - положение) указываете месторасположение картинки.

Существует несколько способов вставки изображения.
Например, если вы хотите вставить картинку (файл kartinka.jpg), которая находится в папке images (отсчет идет относительно папки с веб-страницей - как в примере с относительными ссылками), то пишем следующее: Файл kartinka.jpg находится в папке images, которая расположена в той же папке, что и данная страница.

Если же вы размещаете изображение с указанием сайта, на котором она находится, то адрес будет выглядеть немного по-другому (как в примере с абсолютными ссылками).
С помощью атрибутов можно задавать размеры (высота - height, ширина - width), отступы изображения от текста (по горизонтали - hspace, по вертикали - vspace), выравнивание (align) картинки на странице.
Пример:
Результат: изображение logotype.png (находится в папке на уровень выше той, где находится данная страница) шириной 104 пиксела и высотой 100 пикселов выровнено слева с отступами от текста по 5 пикселов по горизонтали и вертикали. Прописан также атрибут <alt>, который содержит текст "логотип сайта 1sait.com". Он отображается в окне обозревателя, если в настройках отключен показ картинок и также этот текст важен для поисковых систем (в особенности для поиска по картинкам).



Результат: А данная картинка является гиперссылкой (<a href="http://1sait.com">...</a>). Нажатией по ней приведет к перенаправлению пользователя на главную страницу сайта 1sait.com. Также, у атрибута border стоит значение "0", что означает отсутствие границы у картинки, являющейся гиперссылкой.

Источник урока: 1sait.com