Использование изображения в качестве общего фона ссылки

Question

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

Я пробовал:

a { 
    font-size: 40px;
    background: url('images/shooting-stars/shooting-star-link.png') no-repeat left top; 
}

Но это не работает, изображение не отображается.

Answer 1

"Я хочу иметь красивую рамку, представляющую кнопки, но я не могу понять это."- Я не понимаю эту часть.

В любом случае, ваш CSS выглядит отлично, вы уверены, что изображение существует?Это рабочий пример с точно таким же кодом, только изображение, которое, я уверен, существует:

http://jsfiddle.net/3k9nm/

Если вы хотите всегда показывать изображение, даже если тексткороче, вы должны установить минимальную ширину для ссылок.Это означает, что они должны быть встроенными блоками, вы не можете установить ширину для обычной ссылки (которая является встроенным элементом).

a {
  display: inline-block;
  min-width: 25px;  
}

(25 пикселей было выбрано случайным образом, заполните ширинувашего фонового изображения ..)

Answer 2

HTML

<div id="example-link">
  <a href="#">Link to journal article</a>
</div>

CSS

#example-link a { 

  background: url('images/shooting-stars/shooting-star-link.png'); 
}

Answer 3

Две вещи, которые нужно попробовать, есть ли текст в реальных <a> ссылках?И если вы используете Firebug, вы можете убедиться, что у вас есть правильный путь к файлу изображения ...