设置表格td超出内容后截取并以...显示
.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超出内容后截取并以...显示的更多相关文章
- js实现html表格<td>标签中带换行的文本显示出换行效果
遇见问题 如下内容中我写了几行,但是表格中并未按行显示,换行符反而变成了空格,于是想自己转换下 思考问题 1.可以看到表格的内容是后端传来的数据,于是想直接在后端转换下,把换行符替换成<br&g ...
- CSS设置表格TD宽度布局
使用表格布局时,对单元格的宽度控制很伤脑筋,所以查阅资料整理如下: 一.表格布局table-layout 语法: table-layout : auto | fixed 取值: auto : 大多数 ...
- table表格td内内容自动换行
项目开发时,遇到问题:td内传入数据,全是字母,不会自动换行 一般字母数字/特殊符号的话,会被浏览器默认是一个字符串或者说一个单词,不会自动换行 所以需要设置一下,让表格内容自动换行. 1.给td标签 ...
- 设置表格td宽度
CSS布局,表格宽度不听使唤的实例.想把表格第一例宽度设为20,其他自适应.但CSS中宽度是等宽的.只设这一行也不起作用.但是在实际应用中总是等宽处理,并不按照样式来走. XML/HTML代码 & ...
- html如何设置表格单元格内容垂直居中?
父元素设置为表格的单元格元素td,而在表格单元格中的元素设置vertical-align: middle; 对父容器(td)使用:display: table-cell 其内子元素使用:vertica ...
- 关于table表格td里内容是数字而且太长不换行的问题
<p>table{table-layout:fixed}</p><p>table td{word-wrap:break-word}</p><p&g ...
- 关于table表格 td里内容较多换行的处理方法
最近在用table的时候由于td内容较多默认换行了,很不美观.于是找到处理方法: 在声明table的时候添加一个样式: <table id="tbOffice" data-r ...
- 文字超出DIV后,隐藏文字并显示...
<html> <head> <style type="text/css"> #cs{width:100px;height:50px;line-h ...
- 表格里使用text-overflow后不能隐藏超出的文本的解决方法
当把text-overflow设为ellipsis时文本溢出内容就能显示为省略标记,而设为clip时就能把文本溢出的部分裁切掉,不过在表格里面使用text-overflow后依旧不能隐藏超 ...
随机推荐
- 自定义toast功能
http://download.csdn.net/detail/caryt/8105031
- 利用WinDriver开发PCI设备驱动程序
摘要 WinDriver是Jungo公司出版的一个设备驱动程序开发组件,它可以大大加速PCI设备驱动程序的开发.作者在实际的项目中采用了WinDriver来开发设备驱动程序,取得了相当好的运行效果.从 ...
- Linux下安装GAMS建模优化工具
1.下载GAMS wget http://d37drm4t2jghv5.cloudfront.net/distributions/24.5.6/linux/linux_x64_64_sfx.exe 2 ...
- 简单地使用jquery的validate
简单地使用jquery的validate ——@梁WP 摘要:本文通过一个很简单的例子,讲解了jquery validate的最基础使用方式. 一.源代码 注意事项都写在代码的注释里了,哈哈. < ...
- DNS服务器安装配置案例详解
案例配置要求:假设有一个域名:tianyik.com主机为:192.168.31.36 mail 192.168.31.37 www 192.168.31.38 pop --> ...
- struts2 自定义拦截,防止非法操作
<package name="defaults" extends="struts-default"> <interceptors> &l ...
- 关于css的兼容
这篇随笔为了方便自己后期的学习和查找,用来记录平时遇到的一些问题,后期会陆续更新 1.背景图 :background-position属性,在ff下不支持该属性的拆分写法(background-pos ...
- word每次打开都要选择文档类型
每次打开word07 都出现下面一个框框,说要转换文件. 在Word2013文档中,为了能更好地使用“从任意文件还原文本”功能,用户需要启用“打开时确认文件格式转换”功能,以在打开并恢复文件时出现文件 ...
- 《你不常用的c#之三》:Action 之怪状
转载自csdn:http://blog.csdn.net/robingaoxb/article/details/6199891 例1: public static void Main() { Li ...
- 使用Navicat for Oracle 出现的错误
错误提示: 意思是不能创建oci环境我们需要对 Navicat for Oracle 做一下配置依此选择 Tools -> Miscellaneous -> OCI OCI library ...