活用CSS巧妙解决超长文本内容显示问题 - html/cs

现实中经常出现一些内容比较长的文本，为了使整体布局美观，需要将文本内容控制在一行显示，并且截取一定的长度，截取的地方用省略号代替。虽然用动态语言可以对其控制，但是这样做是不利于搜索引擎收录的，活用 CSS可以巧妙地解决这个问题，请看下面的代码：     代码一：用于非表格LI或span等都可以     .text-overflow {   display:block;/*内联对象需加*/   width:31em;   word-break:keep-all;/* 不换行 */   white-space:nowrap;/* 不换行 */   overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */   text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...);需与overflow:hidden;一起使用。*/   }        代码二：用于表格     table{   width:30em;   table-layout:fixed;/* 只有定义了表格的布局算法为fixed，下面td的定义才能起作用。 */    }   td{  width:100%;   word-break:keep-all;/* 不换行 */   white-space:nowrap;/* 不换行 */   overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */   text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...);需与overflow:hidden;一起使用。*/    }