Html 基于宽度同级图像宽度的CSS剪辑字符串

是否可以在不定义绝对宽度的情况下剪裁（使用省略号）字符串？ 我知道，如果我设置了绝对宽度，以下类将起作用：

div {
width: 200px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

但是，如果文本的宽度超过以下图像的宽度，我希望剪切文本的宽度（使用省略号）：

<div>@graphic.Name</div>
<img src="@graphic.ApplicationFilePath" alt="" />

@graphic.Name

您可以将这两个元素包装到您制作的

内联块的同一包装中。
将文本位置设置为绝对位置，以便只有图像将定义容器的宽度，然后使用
left
/
right


.container{
位置：相对位置；
显示：内联块；
}
.container>div{
位置：绝对位置；
排名：0；
左：0；
右：0；
文本溢出：省略号；
空白：nowrap；
溢出：隐藏；
}
.container>img{
页边距顶部：20px；/*您需要根据文本的高度进行调整*/
}

这是一篇很长的文章
这是一篇很长的文章