Javascript 高度变化时将文本切成两半

我在我的网站上有一个动态改变高度的部分，其中包含一大块文本

溢出设置为“隐藏”，以在文本更改高度时隐藏文本

我遇到的问题是，它经常将文本一分为二，如下图所示

有没有办法改变这种情况，使它仍然剪切它，但在溢出之前，它会剪切文本，停止将文本切成两半

HTML

 <div style="overflow: hidden;" class="col-md-5 desktop-row-excerpt">
   <a asp-controller="PressRelease" asp-action="GetPressRelease" asp-route-id=@Model[0].PressReleaseId>
       <img class="img-responsive" src="@Model[0].HeaderImageUri">
       <p>@Model[0].Title</p>
       <div class="press-release-description-underscore"></div>
       <p class="press-release-excerpt press-release-excerpt-1">@Model[0].Summary</p>
    </a>
</div>

---

涉及最少JS的最简单解决方案是将高度设置为元素行高度的整数倍<代码>行高将为每行文本定义可用的垂直空间（与实际字体大小无关），通过将高度设置为该值的倍数，可以确保文本不会被剪切，除非在一行之后

//将容器高度设置为3行
$（'div'）.css（'height'，parseInt（$（'div'）.css（'line-height'））*3
div{
高度：69px；/*以线高度的非清洁倍数开始*/
线高：20px；
溢出：隐藏；
}

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除了偶尔不自以为是的行为外，还必须为自己的行为负责。
最简单的解决方案是将高度设置为元素线条高度的整数倍<代码>行高

将为每行文本定义可用的垂直空间（与实际字体大小无关），通过将高度设置为该值的倍数，可以确保文本不会被剪切，除非在一行之后

//将容器高度设置为3行
$（'div'）.css（'height'，parseInt（$（'div'）.css（'line-height'））*3
div{
高度：69px；/*以线高度的非清洁倍数开始*/
线高：20px；
溢出：隐藏；
}

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除了圣奥卡塔·库皮达特（sint Occaet Cupidat）这一点，我并不自以为是，因为我要用px将页面上另一个元素的高度设置为该元素的高度，如果你看我的JS，你会怎么做value@Kieranmv95：我在回答中添加了一个基于JS的示例。您可以使用
parseInt（$（'div'）.css（'line-height'））
来获取行高的数值，然后从中进行计算如果您在我使用px将高度设置为页面上另一个元素的高度时查看我的JS，这将如何工作value@Kieranmv95：我在回答中添加了一个基于JS的示例。您可以使用
parseInt（$（'div'）.css（'line-height'））
获取行高的数值，然后从中进行计算
//excerpt shortening functionality
$(document).ready(function () {

    function resizeExcerpts() {
        //resize containers to match 2 centerones on desktop module
        var matchOneHeight = $('.excerpt-match-1').outerHeight();
        $('.desktop-row-excerpt').outerHeight(matchOneHeight - 10);

        var matchTwoHeight = $('.excerpt-match-2').outerHeight();
        $('.desktop-row-excerpt-2').outerHeight(matchTwoHeight - 10);
    }

    $(window).resize(function () {
        resizeExcerpts();
    });

    resizeExcerpts();

});