为图像添加标题答案

【问题标题】：adding caption to image为图像添加标题
【发布时间】：2012-02-14 04:05:42
【问题描述】：

如何在http://notions.okuda.ca/2007/02/06/cool-css-image-border-style/ 提及的图像边框示例中添加文本标题

我想在指定图像路径的同一位置使用代码（不在样式表中），所以在某处

<img src="SOMETHING.jpg" style="display: block; margin-left: auto; margin-right: auto; padding:8px; border:solid; border-color: #dddddd #aaaaaa #aaaaaa #dddddd; border-width: 1px 2px 2px 1px;" />

【问题讨论】：

标签： caption

【解决方案1】：

您知道自 2007 年以来发生了很多变化吗？ CSS3 引入了 box-shadow 属性，它可以做到这一点，但更现实。

但是，如果没有 HTML 或 JavaScript，您将无法制作标题。 CSS 无法从 HTML 中读取属性。

这是一个演示：http://jsfiddle.net/2DuyU/3/

【讨论】：

【解决方案2】：

我不明白你怎么能做到这一点，至少要像这样不做一个 p 标签：

    <p><img src="location/of/my_image" alt=""/><br/>Caption</p>

改为将样式添加到 p 标签中。

示例：http://jsbin.com/ewazir

【讨论】：

【解决方案3】：

我认为你应该写以下内容

<img>your caption</img>

【讨论】：