Html 根据图像大小调整文本大小

我有一个图像和它下面的文本块。我试图使最大宽度的文字宽度的图像。（未定义图像的大小，也未定义父div的大小）

Lorem ipsum dolor sit amet，是一位杰出的献身者。纳拉姆·非里索斯·多洛，一个尤伊斯莫·利奥。菲舍勒斯·维韦拉·阿利奎特·菲利斯·埃吉特·波特托。埃尼安·索利西图丁、乌兰科珀、矢状面扫描电镜、苏打水和非苏打水扫描电镜。前庭无侧壁，侧壁无侧壁，侧壁有侧壁。纳拉尼斯酒店暂停营业。我是萨皮安·奥迪奥，埃吉特·康莫多·梅特斯。乌尔特里斯·莱克托斯坐在阿梅特·马萨的位子上。不，我不，元素坐在阿梅特·福西布斯的座位上，佩伦茨克的座位上。酒后驾车。在我们的生命之门，我们是一个智者。ultricies erat的Maecenas。Maecenas diam arcu，调味品eu孕妇quis，nunc的aliquam。酒后驾车在奥奇酒厂。不要为我们的未来而担忧。在pretium auctor nulla中，blandit dapibus ante auctor位于

为了更好地理解，我画了一个快速模型-

代码笔-

有什么方法可以实现这一点吗？（不需要此类标记，如果需要，可以添加更多元素）

---

谢谢你的帮助

您需要将它们包装在另一个

div

元素中，设置其最大宽度属性，然后为图像定义100%宽度，如下所示：

div {
    max-width: 500px;
}

div img {
    width: 100%;
}

---

如果您坚持使用您构建的结构，那么请查看此JSFIDLE演示>

，JS是唯一的选项

$(init);

function init()
{
  var w = $("img").innerWidth();
  $('p').css({"width": w});
}

---

不过，在另一个容器中包装图像和段落文本会更好。

您可以使用以下小脚本完成此操作：

$('p').css('width',$('img').width() + 'px');

它取

img的
width
，并将其应用于
p的
width
。
这里是
mhhhm，我不知道是否可以通过css来实现这一点。如果您想在不使用javascript的情况下完成此操作，我只知道以下内容：
我已经玩了一段时间，我设法用
html
和
css
：
html:


问题是它只能在firefox和chrome中使用。
谢谢，问题是我不知道图像的宽度（最大宽度）。
$('p').css('width',$('img').width() + 'px');

<div class="container">
   <img src="http://dummyimage.com/300x200/000/fff&text=image" />
   <p>Lorem ipsum [...]</p>
</div>

.container {
   margin: 0 auto;
   width: -moz-min-content;
   width: -webkit-min-content;
}