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. JavaScript输出

    JavaScript不提供任何的内建或是打印方式 JavaScript的显示方案主要有以下四种: window.alert()  写入警告框 document.write()  写入 HTML 输出 ...

  2. mybatis添加数据时返回主键 insert 返回主键值

    insert 返回主键值 useGeneratedKeys=“true” parameterType=“USer” keyProperty=“id”, <insert id="inse ...

  3. 改变input的placeholder字体颜色

    改变input的placeholder字体颜色,注意哦,只是placeholder的字,用户输入的字不可以 input::-webkit-input-placeholder{ coloc:#000; ...

  4. Csharp随机生成序列码的方式Guid方法

    主要用于邮箱激活,加密等用处 Guid.NewGuid().ToString()得几种格式显示 .Guid.NewGuid().ToString("N") 结果为: 38bddf4 ...

  5. andriod工程项目总结

    1,胡萝卜农场项目 (1)图片缓存项目 (2)android开源框架的尝试 2,智能厨房项目 (1)将所有网络请求防止到一个service中的思路 (2)左右导航的实现 (3)fragment的使用 ...

  6. [转]Vue项目全局配置微信分享思路详解

    这篇文章给大家介绍了vue项目全局配置微信分享思路讲解,使用vue作为框架,使用vux作为ui组件库,具体内容详情大家跟随脚本之家小编一起学习吧 这个项目为移动端项目,主要用于接入公众号服务.项目采用 ...

  7. 解决Firefox已阻止运行早期版本Adobe Flash

      解决Firefox已阻止运行早期版本Adobe Flash     类别    [随笔分类]web   解决Firefox已阻止运行早期版本Adobe Flash   最近火狐浏览器不知抽什么风, ...

  8. DAY 3 上午

    状压DP 状态压缩dp 状态压缩是设计dp状态的一种方式. 当普通的dp状态维数很多(或者说维数与输入数据有关),但每一维总量很少时,可以将多维状态压缩为一维来记录. 这种题目最明显的特征就是:都存在 ...

  9. VS Project Property Manage

    概念:Project Property 和 Property Sheet. Project Property:项目属性,是你当前项目的属性配制,保存在你工程的配制文件中,rojectName.vcxp ...

  10. 十一、python函数学习

    1.    定义函数 def   函数名(形参): 函数体 return  xxx--------其下面的内容不再执行 ---------------------------------------- ...