表栏的HTML文本显示限制 [英] HTML text display Limit for table column

问题描述

我有一张桌子，它的宽度是200像素.

I have a table which width of it is 200px.

它有2列:

1. 标题(简单文本，链接等)
2. 徽标(img)

问题:当标题+徽标"超过200像素时，我只需要限制标题.

issue is: when Title + Logo exceed 200px I need to limit only Title.

------------------------
|Title      |Logo      |
------------------------
|Helloooo...|img       |
------------------------

约束仅HTML和CSS

Constraints only HTML and CSS

我尝试不同的想法:

overflow: hidden; 
text-overflow: ellipsis; 
white-space: nowrap;
table-layout:fixed;
...

我得到的唯一结果是:

------------------------
|Title      |Logo      |
------------------------
|Helloooooooooooo|img       | -> more than 200px
------------------------

推荐答案

/编写CSS代码如下/

.appadd {

white-space: nowrap;
overflow: hidden;
width: 180px;
height: 30px;
text-overflow: ellipsis; 

}

实时演示-转到此链接

这篇关于表栏的HTML文本显示限制的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！