1 Topic by PunBB

Topic: Как сделать картинку, изображение ссылкой

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

1. Для создания ссылки в HTML используется тег <a>. Атрибут <href> данного тега - задает путь к документу, на который нужно перейти.

<a href="/URL-адрес ссылки" >Название ссылки</a>

2. Для вывода изображения в HTML используется тег <img>. Атрибут <src> данного тега - задает путь к картинке.

<img src="/Путь к картинке" >

3. Для того, чтобы картинка стала ссылкой, объединяем теги:

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

2 Reply by PunBB

Re: Как сделать картинку, изображение ссылкой

Как открыть картинку в новой вкладке:
target="_blank" - ссылка должна открываться в новом окне;

<a href="/URL-адрес ссылки" target="_blank" ><img src="/Путь к картинке" ></a>

Как выровнять изображение по левому краю
align="left" - выравниваем картинку по левому краю;

<a href="/URL-адрес ссылки" align="left" ><img src="/Путь к картинке" ></a>

Как сделать описание кликабельной картинки
alt="Описание картинки" - альтернативный текст для картинки (выводится вместо картинки, если в браузере отключена загрузка изображений);

<a href="/URL-адрес ссылки" alt="Описание картинки" ><img src="/Путь к картинке" ></a>

Как добавить всплывающий текст при наведении на изображение
title="Текст при наведении" - текст, который будет выводится при наведении курсора на картинку;

<a href="/URL-адрес ссылки" title="Текст при наведении" ><img src="/Путь к картинке" ></a>

Как задать размеры изображения
width="200" - ширина картинки;
height="100" - высота картинки;

border="0" - рамка вокруг картинки (по умолчанию вокруг картинки появляется рамка в 1 px, для того, чтобы убрать рамку, нужно поставить значение "0").

3 Reply by TheDenchik

Re: Как сделать картинку, изображение ссылкой

Можно еще через тег <a> размещать!

<a href=site img src=img></a>
PunBB developer

TheDenchik's Website

4 Reply by Buzz

Re: Как сделать картинку, изображение ссылкой

А как эти html коды вставлять сообщения? У меня только BB коды работают

5 Reply by PunBB

Re: Как сделать картинку, изображение ссылкой

Для вставки html тегов было написано какое то расширение, не помню есть ли оно у нас в архиве...

6 Reply by Avistar

Re: Как сделать картинку, изображение ссылкой

Buzz wrote:

А как эти html коды вставлять сообщения? У меня только BB коды работают

конвертер:
https://html2bbcode.ru/converter/

2