在包含信息的图像自己的页面中打开图像

Have image open in its own page with information

本文关键字：图像 自己的 包含 信息      更新时间：2023-09-26

我有一个带有图像的页面。每个图像都有与之关联的信息，当单击图像时，我希望在自己的页面（而不是新选项卡或窗口）中打开它，并在其周围显示一些相关信息。

有没有办法做到这一点，我不必为每个图像手动制作页面？我正在处理大量图片，因此自动化是关键。

像这样的东西 ？ 信息可以移动，根据需要设置样式。

.info{display:none}
img:hover +.info{display:inline;}
<img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span>
<img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span>
<img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span>
<img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span><img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span><img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span><img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span>*emphasized text*

相关文章：