html - CSS如何在<div>中不换行的情况下继续文本

Question

我只是想知道我应该如何添加到我的 div 样式以使文本以“...”继续，而不是像这样换行:

我的代码在下面，我希望这种样式与我的 porfolio-info div 一起使用:

<div class="portfolio-wrapper">
    <div class="portfolio-single">
        <div class="portfolio-thumb">
            <img src="image-link" alt="" height="300px">
        </div>
    </div>
    <div class="portfolio-info" style="border: 1px dotted gray; display: inline;">
        <h2>Text will be here</h2>
    </div>

谢谢

Answer 1

试试下面

.portfolio-info{ text-overflow: ellipsis ellipsis; text-align: center; }

Demo