裁剪文本太长在div

本文介绍了裁剪文本太长在div的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 < div style =display：inline-block; width：100px;> 很长的文本< / div> 以任何方式使用纯CSS剪切太长的文本，而不是显示在下一个新行只显示最多100px 解决方案 < div class =crop> longlong longlong longlong longlong longlong longlong< / div> 这是一种可能的方法， / p> .crop {width：100px; overflow：hidden; height：50px; line-height：50px;} 这样，长文本仍会换行，但由于溢出设置，通过设置 line-height 与 height 相同，我们确保只有一行 请参阅这里的演示和nice overflow property description with interactive examples。 <div style="display:inline-block;width:100px;">very long text</div>any way to use pure css to cut the text that is too long rather than show on next new line and only show max 100px 解决方案 <div class="crop">longlong longlong longlong longlong longlong longlong </div>​This is one possible approach i can think of.crop {width:100px;overflow:hidden;height:50px;line-height:50px;}​This way the long text will still wrap but will not be visible due to overflow set, and by setting line-height same as height we are making sure only one line will ever be displayed.See demo here and nice overflow property description with interactive examples. 这篇关于裁剪文本太长在div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！