如何在div元素中隐藏太长的文本？

问题描述：

如何隐藏div中的溢出？

How can you hide the overflow in a div?

如果文本长度大于div

Here the text just wraps down to a new line if the text is longer than the div

<div style="width:50px; border:1px solid black; overflow-y:hidden">
    test test test test
</div>

答

如果您只想显示一行文字在固定宽度div中，给出 white-space：nowrap a go。与 overflow：hidden 一起，它会强制浏览器不打破行并裁剪视图到你的强制宽度。

If you only want to show a single line of text in a fixed width div, give white-space:nowrap a go. Together with overflow:hidden it will force your browser not to break the line and crop the view to your forced width.

您还可以添加 text-overflow：ellipsis 以避免将单词和字母切成两半，它添加了一个很好的 ... 到结束，以显示有一些位缺失。我不确定浏览器支持，但我从来没有尝试过这个。

You might also add text-overflow:ellipsis to avoid cutting words and letters in half, it adds a nice ... to the end to show you there's some bits missing. I'm not sure about the browser support though, and I've never tried this one.

如何在div元素中隐藏太长的文本？

相关推荐