【问题标题】:text-overflow:ellipsis for the first line when line breaks文本溢出:换行时第一行的省略号
【发布时间】:2013-04-09 16:20:43
【问题描述】:

我有一个带有 CSS 的 div:

div.c
{
font-size: 18px;
color: #888;
max-width: 300px;
display: inline-block;
overflow: hidden;
line-height: 20px;
text-overflow: ellipsis;
word-break: break-all;
}

The content in this div is "Abcdef abcdefabcdefabcdefabcdefaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa" //for example, given only to show length in div.

但是如果使用上面的CSS,div 的内容会被破坏并且没有three dots //as of text-overflow: ellipsis;。如果我删除word-break: break-all;,那么将形成两行,第一行是第一个单词,第二行是第二个单词。但是text-overflow: ellipsis; 可以处理这个问题。

我该怎么做才能将所有文本保留在一行上并让text-overflow: ellpsis; 工作?

谢谢!

【问题讨论】:

    标签: css html text


    【解决方案1】:

    white-space: nowrap; 我相信你需要的。

    【讨论】:

    • 谢谢...这正是我想要的。
    猜你喜欢
    • 2013-04-01
    • 2018-07-22
    • 1970-01-01
    • 2021-05-01
    • 2015-10-20
    • 2021-11-19
    • 2015-11-30
    • 2017-01-21
    • 2019-04-29
    相关资源
    最近更新 更多