在图像显示图像标题

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

您可以使用jQuery这样https://jsfiddle.net/a1gqm3nj/

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 2

我认为你正在寻找这样的事情:)

.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;
}

<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>

Answer 3

试一次

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