CSS is too long for table cell TD text in HTML

Reference http://www.cnblogs.com/lekko/archive/2013/04/30/3051638.html

http://www.zhangxinxu.com/wordpress/?p=4105

Focus only on the CSS properties that implement its effect, ignoring browser compatibility.

table{table-layout:fixed;}. Autocut{width:200px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}. Autocut:hover{overflow:visible;white-space:normal;word-wrap:break-word;}

Take a look at the properties that achieve the effect:

table-layout:fixed;

Keep the table layout fixed, that is, the width of the table is not automatically calculated by the size of the cell contents.

Overflow:hidden;

Let the overflow content be clipped so that it is not visible.

White-space:nowrap

Does not fold the row display.

Text-overflow:ellipsis;

Overflow text display ellipsis mark ...

overflow:visible;

Overflow text visible, normal display.

White-space:normal;

Default. The blank will be ignored by the browser. That's not very understanding.

Word-wrap:break-word;

Wraps a line inside a long word or URL address.

CSS is too long for table cell TD text in HTML