.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

<table style="table-layout:fixed" id="table" data-toolbar="#toolbar" data-show-refresh="true" data-show-toggle="true" data-show-columns="true" data-pagination="true" data-side-pagination="server" data-page-list="[5, 10, 20, 50, 100, 200]" data-sort-name="name" data-sort-order="desc">
<thead>
<tr>
<th data-field="state" data-checkbox="true" class="ellipsis"></th>
<th data-field="ID" data-visible="false">ID</th>
<th data-field="Title" data-sortable="true" class="ellipsis">标题</th> 
<th data-field="Catalog" data-sortable="true" class="ellipsis">栏目</th> 
</tr>
</thead>

备注：表格一定要加 style="table-layout:fixed" 

设置表格td超出内容后截取并以...显示的更多相关文章

  1. js实现html表格<td>标签中带换行的文本显示出换行效果

    遇见问题 如下内容中我写了几行,但是表格中并未按行显示,换行符反而变成了空格,于是想自己转换下 思考问题 1.可以看到表格的内容是后端传来的数据,于是想直接在后端转换下,把换行符替换成<br&g ...

  2. CSS设置表格TD宽度布局

    使用表格布局时,对单元格的宽度控制很伤脑筋,所以查阅资料整理如下: 一.表格布局table-layout 语法: table-layout : auto | fixed 取值: auto  : 大多数 ...

  3. table表格td内内容自动换行

    项目开发时,遇到问题:td内传入数据,全是字母,不会自动换行 一般字母数字/特殊符号的话,会被浏览器默认是一个字符串或者说一个单词,不会自动换行 所以需要设置一下,让表格内容自动换行. 1.给td标签 ...

  4. 设置表格td宽度

      CSS布局,表格宽度不听使唤的实例.想把表格第一例宽度设为20,其他自适应.但CSS中宽度是等宽的.只设这一行也不起作用.但是在实际应用中总是等宽处理,并不按照样式来走. XML/HTML代码 & ...

  5. html如何设置表格单元格内容垂直居中?

    父元素设置为表格的单元格元素td,而在表格单元格中的元素设置vertical-align: middle; 对父容器(td)使用:display: table-cell 其内子元素使用:vertica ...

  6. 关于table表格td里内容是数字而且太长不换行的问题

    <p>table{table-layout:fixed}</p><p>table td{word-wrap:break-word}</p><p&g ...

  7. 关于table表格 td里内容较多换行的处理方法

    最近在用table的时候由于td内容较多默认换行了,很不美观.于是找到处理方法: 在声明table的时候添加一个样式: <table id="tbOffice" data-r ...

  8. 文字超出DIV后,隐藏文字并显示...

    <html> <head> <style type="text/css"> #cs{width:100px;height:50px;line-h ...

  9. 表格里使用text-overflow后不能隐藏超出的文本的解决方法

          当把text-overflow设为ellipsis时文本溢出内容就能显示为省略标记,而设为clip时就能把文本溢出的部分裁切掉,不过在表格里面使用text-overflow后依旧不能隐藏超 ...

随机推荐

  1. 在Delphi中实现HexToStr函数和StrToHex函数

    function TransChar(AChar: Char): Integer; begin '] then Result := Ord(AChar) - Ord(') else Result := ...

  2. Linux平台的boost安装全解

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css); @import url(/ ...

  3. Android with Eclipse - Waiting for HOME ('android.process.acore') to be launched?

    mac机中使用命令行方式启动android sdk manager,有需要的朋友可以参考下. 相信使用mac机的用户做android开发都会有一个困惑,就是如何更新android sdk,或者说直接使 ...

  4. ubuntu 14.04 编译安装 nginx

    下载源码包 nginx 地址:http://nginx.org/en/download.html  下载nginx 1.4.7 编译前先安装两个包: 直接编译安装会碰到缺少pcre等问题,这时候只要到 ...

  5. HTML+CSS基础学习笔记（8）

    一.水平居中设置--行内元素 如果设置元素为文本.图片等行内元素时,水平居中是通过给父元素设置text-align:center来实现的 二.水平居中设置 --定宽块状元素 #当被设置元素为块状元素时 ...

  6. Linux - 扩展

    每次输入命令行按下 Enter 键时,bash 都会在执行命令之前对文本进行多重处理.比如 "cd ~" 中的 "~" 的会被识别为当前用户的主目录.产生这个结 ...

  7. UML图基本类型

    use case model用例模型 analysiss model分析模型 design model设计模型 implementation model实现模型 deployment model部署模 ...

  8. 网页版 treeview使用中遇到的问题

    <div class="ScrollBar" id="ItemsTree"></div> var cla = $("#Item ...

  9. 规划收发你的邮件，使用qq邮箱接收阿里云企业邮邮件

    使用qq邮箱接收阿里企业邮 首先管理员开通企业邮后会发来激活短信 根据短信提示打开https://qiye.aliyun.com企业邮登陆地址 使用短信提供的密码登陆邮箱 首次登陆时会让我们重设密码 ...

  10. Table显示滚动条

    Table显示滚动条,要先把table放到一个div中,div的长度和宽度要固定,控制overflow属性为scroll <div style="width:700px; height ...