zoukankan      html  css  js  c++  java
  • td内容超出 以…显示

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

    <style type="text/css">
      table{
        table-layout: fixed;
        border-collapse:collapse;
         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>

    效果图:

  • 相关阅读:
    以正确的方式开源 Python 项目
    一个备胎的自我修养
    关于我们 | 读书马上
    基于libevent, libuv和android Looper不断演进socket编程
    libuv 与 libev 的对比
    OCaml Language Sucks
    Practical Common Lisp
    learning
    WebApi系列~QQ互联的引入(QConnectSDK)
    知方可补不足~用xsl来修饰xml
  • 原文地址:https://www.cnblogs.com/lyt598/p/10687821.html
Copyright © 2011-2022 走看看