Есть ли удобный способ получить атрибуцию фонового изображения на уровне презентации?

У меня есть изображение CC-BY, которое я использую в качестве фона, введенное с помощью CSS. Это изображение создано исключительно для его внешнего вида и определенно не для содержания. Мне нужно где-то указать ссылку на это изображение, и, очевидно, было бы лучше сделать эту атрибуцию ссылкой на доброго человека, который предоставил изображение. Однако я действительно не хочу помещать текст ссылки в свой HTML-код, поскольку это нарушает разделение фактического содержимого и представления (я бы сказал, что ссылка атрибуции действительно является частью презентации, поскольку если вы просматривали страницу без фонового изображения , вы бы действительно не хотели это видеть).

Можно ли каким-то образом прямо здесь разделить представление и контент?

Мой текущий код для этого выглядит примерно так


<div class='backgrounded'>
  <div class='content'><h1>Some stuff here</h1></div>
  <div class='attribution'>
    Image from <a href='http://example.com/image'>Lovely CC-BY person</a>
  </div>
</div>

И CSS:


div.backgrounded {
    background: url(/images/an_image.jpg);
}
div.attribution {
    color: #ffffff; 
    float: right;
}

Здесь есть атрибуция в контенте, где я бы предпочел не иметь ее.

Я рассмотрел и другие вещи, в том числе:

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

  • Создание изображения, содержащего текст атрибуции, и размещение его там, где текущая атрибуция , снова на заднем плане, но сверху Думаю, я мог бы сделать ссылку с помощью JavaScript. Кажется, здесь много возни.

Есть ли выход из этого, когда мое изображение упоминается только в CSS? Или, если это не удается, как лучше всего хранить элементы четко разделенными, чтобы, например, изображение можно было заменить без редактирования HTML?

6
задан Duncan Parkes 25 June 2011 в 09:04
поделиться