Как собрать несколько картинок в один рисунок, при этом каждая картинка должна содержать свою ссылку?

Голоса: +1

Хочу получить вот такой результат, подскажите как его лучше достичь?

Каждый кружок должен иметь свою ссылку (новая страница), но на след странице это "мини-меню" должно так же работать. Это можно реализовать?

в архиве есть отдельные картинки: архив

Адрес сайта http://prof-ksma.do.am/
| Автор: | Категория: Дизайн сайта
можно через карту это сделать, можно через таблицу, а можно просто каждой картинке задать расположение в соответствии с фантазией и привязать ссылку.
Здравствуйте. Так як я знаю, то кружочком ссылка не будет(можно поставить картинку(круг), но она все равно будет в форме квадрат).

А сделать такой вид, вам поможет html + css. И все, если так не умеете, обратитесь к фрилансеру

Ответов: 2

голоса: +2
 
Лучший ответ

Здравствуйте, вот так:

<div style="background: url('http://i072.radikal.ru/1504/22/828df9b53aab.png') no-repeat; width:310px; height:279px; position:relative; margin:100px">
<a href="" style="background: url('http://s61.radikal.ru/i171/1504/fa/4c7f195396eb.png') no-repeat; width:124px; height:115px; position:absolute; top:-45px; left:-35px;"></a>
<a href="" style="background: url('http://s50.radikal.ru/i130/1504/5e/a3fc2d2f3c63.png') no-repeat; width:126px; height:120px; position:absolute; top:-45px; right:-35px;"></a>
<a href="" style="background: url('http://s015.radikal.ru/i333/1504/e7/dd2cc90878fc.png') no-repeat; width:124px; height:115px; position:absolute; bottom:35px; left:-85px;"></a>
<a href="" style="background: url('http://s017.radikal.ru/i425/1504/c1/d3dc1f09c481.png') no-repeat; width:124px; height:115px; position:absolute; bottom:35px; right:-85px;"></a>
<a href="" style="background: url('http://s018.radikal.ru/i517/1504/67/8a3d3e63004a.png') no-repeat; width:124px; height:115px; position:absolute; bottom:-85px; left:95px;"></a>
</div>

| Автор:
Выбор ответа лучшим | | Автор: Профком Кировская ГМА
голоса: +2

    <div style="position:relative; width:500px; height:500px;">
    <div style="position:absolute; top:10px; left:10px; background:grey; width:30px; height:30px;"></div>
    <div style="position:absolute; top:60px; left:60px; background:green; width:70px; height:70px;"></div>
    <div style="position:absolute; top:0px; left:70px; background:black; width:40px; height:40px;"></div>
    <div style="position:absolute; top:150px; left:43px; background:black; width:40px; height:40px;"></div>
    </div>

Ну а дальше уже на что фантазии хватит. Фон убираете, если не нужны квадратики, в содержимое вставляете ссылки с картинками и т.д.

| Автор:
...