Выполняя верстку сайта, мне нужно было сделать так, чтобы некоторая часть «шапки» была — ссылкой.
Безусловно, можно было вставить html-кусок кода где я бы описал точек-координат ссылки, с помощью тегов:
<AREA SHAPE="poly" COORDS="координаты по x и y">
Однако я пошел совсем другим путем.
Итак, в CSS моя шапка выводится следующим способом:
#head {
color: #fff;
clear: both;
background: #fff url(images/searchbg.jpg) no-repeat;
padding: 0px 0 25px 5px;
width: 960px;
position:relative;
margin: 0;
}
Создаем еще один класс:
#head #logo {
position:absolute;
top:1px; //отступ сверху
left:48px; //отступ справа
}
#head #logo a {
display:block;
width:100px; //ширина ссылки
height:50px; //высота
}
Теперь заходим в php файл и находим строчку, где выводится «шапка»:
<div id="head">
И добавляем наш созданный ранее класс:
<div id="logo">
<a href="ссылка"></a>
</div>
В итоге, мы получили прозрачный DIV, который наложен на наш логотип (который прорисован в шапке сайта). Чтобы определить отступы слева и сверху воспользуйтесь линейкой на панели в PhotoShop’e.
Ответить | Цитировать
widgets number 5228
Ответить | Цитировать
ЗЫ: лексдрайв — спамер 🙂