Question

如何在图像上显示图像标题。代码如下所示：

<img typeof="foaf:Image" src="galerija
/public/12191388_934693563270076_3046172221632898681_o.jpg?itok=IHAa2J2n" width="900" height="600" 
alt="" title="Foto: Edis Škulj/fkmladost.ba">

我希望在图片Foto: Edis Škulj/fkmladost.ba

上显示此内容

Answer 1

我认为你正在寻找这样的东西：）

＆＃13;

.wrapper {
  height: 400px;
  width: 400px;
  position: relative;
}
img {
  position: absolute;
  left: 0;
  top: 0;
}
span {
  position: absolute;
  color: white;
  font-size: 30px;
  font-weight: bold;
  left: 150px;
  top: 350px;
}

＆＃13;

<div class="wrapper">
  <img typeof="foaf:Image" src="http://www.real-world-physics-problems.com/images/hot_air_balloon_pic_edit.jpg" alt="" title="Foto: Edis Škulj/fkmladost.ba">
  <span>Foto: Edis Škulj/fkmladost.ba</span>
</div>

＆＃13;

Answer 2

您可以像这样https://jsfiddle.net/a1gqm3nj/

使用JQuery

<强> JS

var title = $('img').attr('title');
$('img').before(title);

<强> HTML

<img typeof="foaf:Image" src="http://placehold.it/900x600" width="900" height="600" alt="" title="Foto: Edis Škulj/fkmladost.ba">

Answer 3

尝试一次

＆＃13;

<img src="http://www.planwallpaper.com/static/images/4-Nature-Wallpapers-2014-1_ukaavUI.jpg" title="this is img Title"/>

＆＃13;

在图像上显示图像标题

3 个答案: