Как я могу получить фон ссылки, чтобы он находился под ним при наведении курсора? - PullRequest
Новая
       63

Как я могу получить фон ссылки, чтобы он находился под ним при наведении курсора?

3 голосов
/ 29 декабря 2011

Я не могу понять, как сделать так, чтобы при наведении на ссылку маленький оранжевый треугольник появлялся под ссылкой вдоль линии, которая у меня уже есть. HTML и CSS это относится ниже.

----- HTML ----- 

<div id='links'>
  <ul>
    <li><a href='#'>home</a></li>
    <li><a href='#'>interests</a></li>
    <li><a href='#'>game</a></li>
    <li><a href='#'>about</a></li>
    <li><a href='#'>contact</a></li>
  </ul>
</div>

----- CSS ----- 

div#links {
background: url('images/links_bg.gif') no-repeat right;
height: 75px;
margin: 0px;
}
div#links ul {
float: right;
list-style: none;
margin: 48px 35px 0px 0px;
}
div#links ul li {
display: inline;
margin: 0px;
}
div#links ul li a {
color: #e5e4e4;
font-size: 12px;
text-decoration: none;
margin: 0px 15px 0px 15px;;
}
div#links ul li:hover {
background: url('images/link_triangle.png') no-repeat;
font-weight: bold;
}

У меня также есть фоновое изображение для всех ссылок. Я думаю, что проблема в том, что, поскольку каждая ссылка в основном представляет собой рамку вокруг текста, вы не можете дать ей фон, который выходит за рамки этой рамки. Я просто не знаю, как это исправить.

Ответы [ 2 ]

0 голосов
/ 29 апреля 2012

Мне просто нужно было возиться с подкладками и чем-то ненадолго. Понял в конце концов. Спасибо за помощь.

0 голосов
/ 29 декабря 2011

Вместо этого вы можете использовать jQuery для отображения изображений в отдельном div под ссылками, используя position: absolute на mouseover.

...