Создание сайта
Регистрация
Продвижение
Монетизация
Облако тегов

Требуется для просмотраFlash Player 9 или выше.

Показать все теги

Главная » Создание сайта » HTML » Как сделать картинку ссылкой в html

Как сделать картинку ссылкой в html
Раздел: Создание сайта » HTML  
29 сентября 2009   |   автор: admin Оставить комментарий



 

Как сделать картинку ссылкой в html

 

Для вывода изображений в html используется тег <img>. Выглядит это таким образом:

 

<img src="адрес картинки" >

 

 

Для того чтобы создать ссылку используется тег <a>. Таким вот образом:

 

<a href="адрес ссылки" >Название ссылки, если необходимо</a>

 

 

Чтобы картинку сделать ссылкой, необходимо всего лишь объединить эти два тега.

 

<a href="адрес ссылки" ><img src="адрес картинки" ></a>

 

 

Тег картинки вставляется внутрь тега ссылки. Таким образом, картинка работает как ссылка, если на нее навести курсор мыши и нажать, произойдет переход по ссылке.

 


Адреса можно прописывать как в полном формате: http:// и т.д

 

Так и в короткой форме, например: kartinka.jpg. Этот вариант доступен, если рисунок у вас лежит в той же папке, что и html файл.

 


Пример

 

Код html:

 

<a href="http://web-lesson.ru"><img src="link_img.png"></a>

 

 

Результат в браузере:

 

 

alt

Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
web-lesson.ru
Другие новости по теме:






Комментарий
#1 Сергей                                                                                                                  7 января 2013 13:47
Спасибо, на "народе" все работает !




[цитировать]           
Комментарий
#2 Катя                                                                                                                  10 февраля 2013 05:31
Заметила такую проблему: если поставить две картинки-ссылки в ряд одну за другой, то при просмотре страницы в браузере между ними появляется маленький символ подчеркивания.
Подскажите как убрать этот символ.




[цитировать]           
Комментарий
#3 юлия                                                                                                                  24 июля 2013 23:26
Спасибо.Все получилось. winked




[цитировать]           
Комментарий
#4 Наталья Юдина                                                                                                                  21 августа 2013 10:10
Спасибо! только начинаю работу с сайтом, так мало знаю!




[цитировать]           
Назад 1 2 3 4 5 6 7 8 9 10 ... 2185 Далее
Добавление комментария
Ваше Имя:
Ваш E-Mail:
Код:
Введите код




/div/div/div