table中的td内容超出以省略号显示,需满足的条件是:

<style type="text/css">
  table{
    table-layout: fixed;
    border-collapse:collapse;
    width: 100%;/*自定义*/
  }
  div,td{
    text-overflow: ellipsis;
    -moz-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
  td{border: 1px solid #aaa;}
</style>

<table>
  <tr>
    <td width="">Datcxcvxcvxcvxcvxcvxcvxcvxcvxcva个水电费感受到分公司发到公司分公司电饭锅搭噶十多个是否感受到公司的风格</td>
    <td>
      <div width="200px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem ex voluptatum cupiditate voluptates est facere quis nostrum earum iure expedita. Aspernatur dolores expedita nostrum ducimus aperiam doloribus magni beatae qui.</div>
    </td>
    <td width="">测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试123123</td>
  </tr>
</table>

效果图:

td内容超出 以…显示的更多相关文章

  1. 表格td内容超出宽度显示... table-layout: fixed;

    td宽度用百分比固定好的时候,即使设置了 white-space:nowrap;/*文本不会换行,在同一行显示*/ overflow:hidden;超出隐藏 text-overflow:ellipsi ...

  2. css设置内容超出后显示省略号

    1.使用overflow: hidden把超出的内容进行隐藏: 2.然后使用white-space: nowrap设置内容不换行: 3.最后使用text-overflow: ellipsis设置超出内 ...

  3. html页面内容超出后显示水平滚动条的问题

    这个问题已经遇到好几次,解决起来也熟练了很多.   出现这种问题一般都是html或页面中的某一内部元素宽度超了. 下面总结我遇到的几种情况: 1.某一内部元素width设为100%,然而它还有bord ...

  4. <td>内容超出自动换行

    td 内容自动换行 table表格td设置宽度后文字太多自动换行 设置table 的 style="table-layout:fixed;" 然后设置td的 style=" ...

  5. table中的td内容过长显示为固定长度,多余部分用省略号代替

    如何使td标签中过长的内容只显示为这个td的width的长度,之后的便以省略号代替. 给table中必须设置属性: table-layout: fixed; 然后给 td 设置: white-spac ...

  6. table中的td内容超出隐藏

    <table style="table-layout: fixed;width: XXX px"> <tr> <td style="whit ...

  7. Div内部的内容超出部分显示省略号(仅仅只有一行内容)

    效果如下:

  8. 当table中的td内容过多,显示不完全,用省略号表示。

    .format{ min-width:100px; max-width:200px; overflow:hidden; white-space:nowrap; text-overflow:ellips ...

  9. DIV内容超出长度显示省略号,鼠标移上自动显示全部内容(EasyUI DataGrid)

    如果想把DIV中超出的文本显示成省略号,而不是换行全部显示,有2个办法. 注:本文主要是以EasyUI的DataGrid为案例的,如果是其他场景只要底层是用DIV显示文本的应该都能使用. 首先可以给此 ...

随机推荐

  1. Mac下Sublime text3无法安装Package Control及中文乱码问题

    sublime text3是一款轻量级的代码编辑器,我曾在Windows下配置过,但时间久了就忘了.这次是在mac上配置,在网上查了一些帖子,有的叙述不是很清楚,故记录一下详细过程. 在线安装: ht ...

  2. spring 知识结构

  3. php array_push()函数 语法

    php array_push()函数 语法 作用:向第一个参数的数组尾部添加一个或多个元素(入栈),然后返回新数组的长度.博智达 语法:array_push(array,value1,value2.. ...

  4. Oracle10g 64位 在Windows 2008 Server R2 中的安装 DBconsole无法启动

    致谢!本文参考http://www.cnblogs.com/leiOOlei/archive/2013/08/19/3268239.html 背景: 操作系统Windows 2008 Server R ...

  5. Delphi XE2 之 FireMonkey 入门(28) - 数据绑定: TBindingsList: 表达式函数测试: SelectedText()、CheckedState()

    Delphi XE2 之 FireMonkey 入门(28) - 数据绑定: TBindingsList: 表达式函数测试: SelectedText().CheckedState() 示例构想: 用 ...

  6. 4 cdh 5.12 centos 6.10三节点安装

    4 cdh 5.12  centos 6.10 三节点安装 [root@hadoop1 opt]# cat /etc/redhat-release CentOS release 6.10 (Final ...

  7. Ora01653 :是表空间不足

    解决方案:表空间中增加数据文件: ALTER TABLESPACE 表空间名称ADD DATAFILE 'D:\app\Administrator\oradata\orcl\Ibomis1.dbf' ...

  8. uni-app-在开启小程序在微信开发工具打开时,打开失败,解决方法:手动打开

    这是我自学ui-app的第一张记录内容,问题都是我在实际开发中遇到的问题 1.微信开发工具打开失败,提示是: 接着我的流程就是打开上面提到的链接,进入页面:https://developers.wei ...

  9. 如何统计序列中元素的频度---Python数据结构与算法相关问题与解决技巧

    实际案例: 1. 某随机序列 [12,5,6,4,6,5,5,7]中,找到出现次数最高的3个元素,它们出现的次数是多少? 2. 对于某英文文章的单词,进行词频统计,找到出现次数最高的10个单词,它们出 ...

  10. Linux(Ubuntu)常用命令(三)

    查看时间  cal :显示当前日期.  cal :显示全年日历./ cal -y 显示当年日历.  date :显示当前时间. 这几个一般不会用到了解即可. 查看进程信息  ps :显示当前进程. - ...