文字溢出:省略号;不截断溢出文本并给出省略号

詹姆士·约翰逊(Django Johnson)

我试图将一个小div中的段落全部强制为一行,不进行换行,并且当它们在div上溢出时将其用省略号截断。

我没有使用no wrap white-space:nowrap;,但是即使将text-overflow设置为省略号,文本仍然在div上溢出。

我究竟做错了什么?

它不应该被支持,因为令人惊讶的是,这两个css3属性都得到了广泛支持。

这是一个有问题的js小提琴:http : //jsfiddle.net/4C7CW/

西瓜

文字溢出

文本溢出声明使您可以处理剪切后的文本:也就是说,文本不适合其框。

文本溢出仅在以下情况下起作用:

  • 盒子有溢出而不是可见的(带有溢出:可见的文本只是从盒子中流出)
  • 该框具有空白:nowrap或一种类似的限制文本布局方式的方法。(否则,文本将换行到下一行)

所以...

#card
{
    width:200px;
    background:red;
    color:#000000;
    font-size:16px;
}

#card p
{
    -o-text-overflow:ellipsis;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
}

http://jsfiddle.net/4C7CW/3/

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

文本溢出省略号未以某些自定义字体显示

来自分类Dev

块级元素是否支持文本溢出:省略号

来自分类Dev

文字溢出:IE中的省略号

来自分类Dev

Flexbox和文本溢出:省略号混合使用吗?

来自分类Dev

滚动时文本溢出省略号未在Chrome和IE中显示溢出内容

来自分类Dev

CSS文字溢出省略号+以%表示的宽度无效

来自分类Dev

带省略号的段落溢出

来自分类Dev

溢出问题:隐藏和文本溢出:省略号

来自分类Dev

如何选择我的溢出省略号开始的位置

来自分类Dev

文本溢出省略号和flex在Firefox上不起作用

来自分类Dev

在带有文本溢出省略号的行之后放置图标

来自分类Dev

文字溢出的样式点:省略号

来自分类Dev

列表项的文本溢出省略号并保留数字

来自分类Dev

文字溢出省略号不起作用

来自分类Dev

宽度100%元素中的文本溢出省略号实现

来自分类Dev

如何在AntDesign的Table组件中添加省略号以溢出文本?

来自分类Dev

Angular Material如何获取复选框文本溢出省略号

来自分类Dev

将文本放置在与第二行文本溢出省略号内联的点后

来自分类Dev

如何防止CSS Grid井喷,使文本溢出省略号起作用

来自分类Dev

如何使文本溢出省略号3点可点击?

来自分类Dev

带有文件扩展名的文本溢出省略号

来自分类Dev

CSS文字溢出:省略号不取决于宽度

来自分类Dev

在我的情况下,文本溢出省略号不起作用

来自分类Dev

如何使用文字溢出:省略号?

来自分类Dev

具有多个跨度的文本溢出省略号

来自分类Dev

文字溢出的样式点:省略号

来自分类Dev

文本溢出省略号不受位置影响:相对

来自分类Dev

CSS 文本溢出省略号无法正确显示

来自分类Dev

文本溢出:省略号不被尊重

Related 相关文章

热门标签

归档