Мои ссылки на изображения не будут работать
Я пытаюсь связать изображение, в HTML выглядит так:
<a href="#" class="image"><img src="logo.png"></a>
и в CSS у меня есть:
.baraMeniu a.image{
display:block;
}
Ага... display:block - просто неловкая попытка сделать изображение кликабельным. Я начинающий, поэтому, пожалуйста, делайте это шаг за шагом.
Изменить: я забыл сказать, что мое изображение имеет следующие свойства:
.baraMeniu img{
width:100%;
height:40em;
position:absolute;
z-index:0;/*the image*/
}
.baraMeniu a.image{
/*the clickable image*/
}
.baraMeniu .st{
font-size:2em;
padding-top:0.15em;
padding-left:0.7em;
padding-right:0.5em;
color:orange;
font-family:'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
display:inline;
text-decoration:none;
float:left;
}
.baraMeniu .dr{
font-size:2em;
padding-top:0.15em;
padding-left:0.7em;
padding-right:0.5em;
color:orange;
font-family:'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
display:inline;
text-decoration:none;
float:right;
}
.baraMeniu #ind{
text-indent:20px;
}
1 ответ
Если вы пытаетесь обернуть <a>
пометьте ваши изображения, вам не нужно никаких специальных приемов.
<a href="SomeLink.html"><img src="logo.png"></a>
Это будет работать нормально.
Позже вы можете изменить его внешний вид, эффекты наведения и т. Д. С помощью CSS или JS.
РЕДАКТИРОВАТЬ для ясности. Вместо того, чтобы нацеливать ваше изображение через элементы на странице, например a.img.classwhatever{}
Для простоты я бы просто дал ему собственный класс или ударил по нему в div. Примените CSS к классу или идентификатору.
<div class="ImageLink">
<a href="SomeLink.html"><img src="logo.png"></a>
</div>
Что касается Z-индекса, пожалуйста, будьте осторожны. Отрицательный означает, что это позади всего остального.