如何在调整大小时/之后保持图像及其文本标题的同步，以始终占据相同的宽度

Question

是否可以在HTML页面中有一个图像，并在其下方有一个与图像宽度相同的文本字段？

是的，我知道这是可能的。但有趣的部分来了：

我希望当我调整浏览器窗口的大小（水平）时，图像及其标题都会同步调整为相同的宽度。

是否可以完全使用 CSS 指定？

或者，如果仅使用CSS是不可能的，那么使用Javascript可以有效地完成此操作吗？

Answer 1

你的意思是这样吗？

.HTML：

<img src="http://placehold.it/350x150" /><br/>
<p>Lorem ipsum dolor sit amet... </p>

.CSS：

body {
    text-align: center;
}
img, p {
 margin:0px auto;
    width: 50%;
}​

这是一个非常基本的示例，说明如何使用 CSS 使 img 标签和p标签具有相同的百分比宽度。